From deb9eab1f8c1806f279e20e203304449f693c48f Mon Sep 17 00:00:00 2001 From: "anna.shakhova" Date: Tue, 14 Apr 2026 13:24:58 +0200 Subject: [PATCH 1/3] GridCore: add public types for AIAssistant --- ...istant_view_controller.integration.test.ts | 17 +--- .../js/__internal/grids/grid_core/m_types.ts | 10 -- packages/devextreme/js/common/grids.d.ts | 70 ++++++++++++++ packages/devextreme/js/ui/data_grid.d.ts | 95 +++++++++++-------- .../devextreme/js/ui/data_grid_types.d.ts | 1 + packages/devextreme/js/ui/tree_list.d.ts | 15 +++ .../devextreme/js/ui/tree_list_types.d.ts | 1 + 7 files changed, 143 insertions(+), 66 deletions(-) diff --git a/packages/devextreme/js/__internal/grids/grid_core/ai_assistant/__tests__/ai_assistant_view_controller.integration.test.ts b/packages/devextreme/js/__internal/grids/grid_core/ai_assistant/__tests__/ai_assistant_view_controller.integration.test.ts index 8507eb20f77b..28c54f07de73 100644 --- a/packages/devextreme/js/__internal/grids/grid_core/ai_assistant/__tests__/ai_assistant_view_controller.integration.test.ts +++ b/packages/devextreme/js/__internal/grids/grid_core/ai_assistant/__tests__/ai_assistant_view_controller.integration.test.ts @@ -6,29 +6,14 @@ import { it, jest, } from '@jest/globals'; -import type { Properties as DataGridProperties } from '@js/ui/data_grid'; import { afterTest, beforeTest, - createDataGrid as commonCreateDataGrid, + createDataGrid, type DataGridInstance, } from '../../__tests__/__mock__/helpers/utils'; -// TODO remove when types added to public dts -interface AIAssistantDataGridProperties extends DataGridProperties { - aiAssistant?: { - enabled?: boolean; - title?: string; - }; -} - -// TODO remove when types added to public dts -const createDataGrid = ( - options: AIAssistantDataGridProperties = {}, -// eslint-disable-next-line @typescript-eslint/no-explicit-any -): ReturnType => commonCreateDataGrid(options as any); - const AI_ASSISTANT_BUTTON_SELECTOR = '.dx-datagrid-ai-assistant-button'; const HIDDEN_CLASS = 'dx-hidden'; diff --git a/packages/devextreme/js/__internal/grids/grid_core/m_types.ts b/packages/devextreme/js/__internal/grids/grid_core/m_types.ts index d925ef21d3bd..2a0d02e319ab 100644 --- a/packages/devextreme/js/__internal/grids/grid_core/m_types.ts +++ b/packages/devextreme/js/__internal/grids/grid_core/m_types.ts @@ -4,9 +4,7 @@ import type { GridBase, GridBaseOptions, SelectionBase } from '@js/common/grids' import type { Component } from '@js/core/component'; import type { PropertyType } from '@js/core/index'; import type { dxElementWrapper } from '@js/core/renderer'; -import type { Properties as ChatOptions } from '@js/ui/chat'; import type { Properties as DataGridOptions } from '@js/ui/data_grid'; -import type { Properties as PopupOptions } from '@js/ui/popup'; import type { Properties as TreeListdOptions } from '@js/ui/tree_list'; import type Widget from '@js/ui/widget/ui.widget'; @@ -129,14 +127,6 @@ export interface InternalGridOptions extends GridBaseOptions; + /** + * @docid + * @type object + */ + responseSchema: Record; +}; + /** * @docid * @hidden @@ -1940,6 +1996,11 @@ interface GridBaseOptionsBlank, TRow * @type object */ export type GridBaseOptions, TRowData = any, TKey = any> = Omit, 'focusStateEnabled'> & { + /** + * @docid + * @public + */ + aiAssistant?: AIAssistant; /** * @docid * @default undefined @@ -2145,6 +2206,15 @@ export type GridBaseOptions, TRowDat * @public */ noDataText?: string; + /** + * @docid + * @default null + * @type_function_param1 e:object + * @type_function_param1_field component:this + * @action + * @public + */ + onAIAssistantRequestCreating?: ((e: EventInfo & Cancelable & AIAssistantRequestCreatingInfo) => void); /** * @docid * @default null diff --git a/packages/devextreme/js/ui/data_grid.d.ts b/packages/devextreme/js/ui/data_grid.d.ts index 18e2f15521c4..b4a675e055ab 100644 --- a/packages/devextreme/js/ui/data_grid.d.ts +++ b/packages/devextreme/js/ui/data_grid.d.ts @@ -41,46 +41,47 @@ import { } from '../localization'; import { - AdaptiveDetailRowPreparingInfo, - ColumnBase as ComponentColumnBase, - ColumnButtonBase as ComponentColumnButtonBase, - GridsContextMenuTarget, - EditingBase as ComponentEditingBase, - EditingTextsBase as ComponentEditingTextsBase, - DataChangeInfo, - DataErrorOccurredInfo, - DragDropInfo, - DragReorderInfo, - DragStartEventInfo, - FilterPanel as ComponentFilterPanel, - FilterPanelCustomizeTextArg as ComponentFilterPanelCustomizeTextArg, - GridBase, - GridBaseOptions, - GroupExpandMode, - KeyDownInfo, - NewRowInfo, - NewRowPosition, - PagingBase as ComponentPaging, - ReducedNativeEventInfo, - RowDragging as ComponentRowDragging, - RowDraggingEventInfo, - RowDraggingTemplateData, - RowInsertedInfo, - RowInsertingInfo, - RowKeyInfo, - RowRemovedInfo, - RowRemovingInfo, - RowUpdatedInfo, - RowUpdatingInfo, - RowValidatingInfo, - SavingInfo, - ScrollingBase as ComponentScrollingBase, - SelectionBase as ComponentSelectionBase, - SelectionChangedInfo, - SelectionColumnDisplayMode, - SummaryType, - ToolbarPreparingInfo, - AIColumnRequestCreatingInfo, + AdaptiveDetailRowPreparingInfo, + ColumnBase as ComponentColumnBase, + ColumnButtonBase as ComponentColumnButtonBase, + GridsContextMenuTarget, + EditingBase as ComponentEditingBase, + EditingTextsBase as ComponentEditingTextsBase, + DataChangeInfo, + DataErrorOccurredInfo, + DragDropInfo, + DragReorderInfo, + DragStartEventInfo, + FilterPanel as ComponentFilterPanel, + FilterPanelCustomizeTextArg as ComponentFilterPanelCustomizeTextArg, + GridBase, + GridBaseOptions, + GroupExpandMode, + KeyDownInfo, + NewRowInfo, + NewRowPosition, + PagingBase as ComponentPaging, + ReducedNativeEventInfo, + RowDragging as ComponentRowDragging, + RowDraggingEventInfo, + RowDraggingTemplateData, + RowInsertedInfo, + RowInsertingInfo, + RowKeyInfo, + RowRemovedInfo, + RowRemovingInfo, + RowUpdatedInfo, + RowUpdatingInfo, + RowValidatingInfo, + SavingInfo, + ScrollingBase as ComponentScrollingBase, + SelectionBase as ComponentSelectionBase, + SelectionChangedInfo, + SelectionColumnDisplayMode, + SummaryType, + ToolbarPreparingInfo, + AIColumnRequestCreatingInfo, + AIAssistantRequestCreatingInfo, } from '../common/grids'; export { @@ -258,6 +259,14 @@ export type GridBaseColumn = ColumnBase; */ export type GridBaseColumnButton = ColumnButtonBase; +/** + * @docid _ui_data_grid_AIAssistantRequestCreatingEvent + * @public + * @type object + * @inherits EventInfo,Cancelable,AIAssistantRequestCreatingInfo + */ +export type AIAssistantRequestCreatingEvent = EventInfo> & Cancelable & AIAssistantRequestCreatingInfo; + /** * @docid _ui_data_grid_AdaptiveDetailRowPreparingEvent * @public @@ -2446,6 +2455,7 @@ export type Row = { /** @public */ export type ExplicitTypes = { + AIAssistantRequestCreatingEvent: AIAssistantRequestCreatingEvent; AdaptiveDetailRowPreparingEvent: AdaptiveDetailRowPreparingEvent; CellClickEvent: CellClickEvent; CellDblClickEvent: CellDblClickEvent; @@ -2546,6 +2556,11 @@ type EventsIntegrityCheckingHelper = CheckedEvents, * @hidden */ type Events = { +/** + * @docid dxDataGridOptions.onAIAssistantRequestCreating + * @type_function_param1 e:{ui/data_grid:AIAssistantRequestCreatingEvent} + */ +onAIAssistantRequestCreating?: ((e: AIAssistantRequestCreatingEvent) => void); /** * @docid dxDataGridOptions.onAdaptiveDetailRowPreparing * @type_function_param1 e:{ui/data_grid:AdaptiveDetailRowPreparingEvent} diff --git a/packages/devextreme/js/ui/data_grid_types.d.ts b/packages/devextreme/js/ui/data_grid_types.d.ts index 0f8612da06b2..f12e87eb9c90 100644 --- a/packages/devextreme/js/ui/data_grid_types.d.ts +++ b/packages/devextreme/js/ui/data_grid_types.d.ts @@ -112,6 +112,7 @@ export { RowDraggingReorderEvent, ColumnButtonClickEvent, AIColumnRequestCreatingEvent, + AIAssistantRequestCreatingEvent, ColumnButtonTemplateData, ColumnCellTemplateData, ColumnEditCellTemplateData, diff --git a/packages/devextreme/js/ui/tree_list.d.ts b/packages/devextreme/js/ui/tree_list.d.ts index 7eebdda84622..1e0a90a79d7b 100644 --- a/packages/devextreme/js/ui/tree_list.d.ts +++ b/packages/devextreme/js/ui/tree_list.d.ts @@ -62,6 +62,7 @@ import { SelectionChangedInfo, ToolbarPreparingInfo, AIColumnRequestCreatingInfo, + AIAssistantRequestCreatingInfo, } from '../common/grids'; import { dxToolbarItem } from './toolbar'; @@ -181,6 +182,14 @@ export type TreeListFilterMode = 'fullBranch' | 'withAncestors' | 'matchOnly'; /** @public */ export type Scrollable = Omit; +/** +* @docid _ui_tree_list_AIAssistantRequestCreatingEvent +* @public +* @type object +* @inherits EventInfo,Cancelable,AIAssistantRequestCreatingInfo +*/ +export type AIAssistantRequestCreatingEvent = EventInfo> & Cancelable & AIAssistantRequestCreatingInfo; + /** * @docid _ui_tree_list_AdaptiveDetailRowPreparingEvent * @public @@ -1799,6 +1808,7 @@ export type Row = { /** @public */ export type ExplicitTypes = { + AIAssistantRequestCreatingEvent: AIAssistantRequestCreatingEvent; AdaptiveDetailRowPreparingEvent: AdaptiveDetailRowPreparingEvent; CellClickEvent: CellClickEvent; CellDblClickEvent: CellDblClickEvent; @@ -1876,6 +1886,11 @@ type EventsIntegrityCheckingHelper = CheckedEvents, */ type Events = { /** + * @docid dxTreeListOptions.onAIAssistantRequestCreating + * @type_function_param1 e:{ui/tree_list:AIAssistantRequestCreatingEvent} + */ +onAIAssistantRequestCreating?: ((e: AIAssistantRequestCreatingEvent) => void); + /** * @docid dxTreeListOptions.onAdaptiveDetailRowPreparing * @type_function_param1 e:{ui/tree_list:AdaptiveDetailRowPreparingEvent} */ diff --git a/packages/devextreme/js/ui/tree_list_types.d.ts b/packages/devextreme/js/ui/tree_list_types.d.ts index 14ca5da11c53..5a0ddf670657 100644 --- a/packages/devextreme/js/ui/tree_list_types.d.ts +++ b/packages/devextreme/js/ui/tree_list_types.d.ts @@ -106,6 +106,7 @@ export { RowDraggingReorderEvent, ColumnButtonClickEvent, AIColumnRequestCreatingEvent, + AIAssistantRequestCreatingEvent, ColumnButtonTemplateData, ColumnCellTemplateData, ColumnEditCellTemplateData, From 1bf724d77b417f5bc0d871fcccbfa0eebd0a4549 Mon Sep 17 00:00:00 2001 From: "anna.shakhova" Date: Tue, 14 Apr 2026 15:39:21 +0200 Subject: [PATCH 2/3] regenerate --- .../src/common/grids/index.ts | 2 + .../devextreme-angular/src/common/index.ts | 2 + .../src/ui/data-grid/index.ts | 106 +- .../src/ui/data-grid/nested/ai-assistant.ts | 110 +++ .../src/ui/data-grid/nested/alert-dxi.ts | 84 ++ .../src/ui/data-grid/nested/attachment-dxi.ts | 84 ++ .../src/ui/data-grid/nested/author.ts | 99 ++ .../src/ui/data-grid/nested/chat-editing.ts | 84 ++ .../src/ui/data-grid/nested/chat-item-dxi.ts | 159 +++ .../src/ui/data-grid/nested/chat.ts | 468 +++++++++ .../nested/custom-speech-recognizer.ts | 83 ++ ...ng-texts.ts => data-grid-editing-texts.ts} | 11 +- .../ui/data-grid/nested/data-grid-editing.ts | 238 +++++ .../ui/data-grid/nested/day-header-format.ts | 116 +++ .../data-grid/nested/file-uploader-options.ts | 594 ++++++++++++ .../src/ui/data-grid/nested/index.ts | 19 +- .../src/ui/data-grid/nested/item-dxi.ts | 79 ++ .../nested/message-timestamp-format.ts | 116 +++ .../data-grid/nested/send-button-options.ts | 92 ++ .../nested/speech-recognition-config.ts | 107 +++ .../nested/speech-to-text-options.ts | 301 ++++++ .../ui/data-grid/nested/typing-user-dxi.ts | 100 ++ .../src/ui/data-grid/nested/user.ts | 99 ++ .../src/ui/tree-list/index.ts | 106 +- .../src/ui/tree-list/nested/ai-assistant.ts | 110 +++ .../src/ui/tree-list/nested/alert-dxi.ts | 84 ++ .../src/ui/tree-list/nested/attachment-dxi.ts | 84 ++ .../src/ui/tree-list/nested/author.ts | 99 ++ .../src/ui/tree-list/nested/chat-editing.ts | 84 ++ .../src/ui/tree-list/nested/chat-item-dxi.ts | 159 +++ .../src/ui/tree-list/nested/chat.ts | 468 +++++++++ .../nested/custom-speech-recognizer.ts | 83 ++ .../ui/tree-list/nested/day-header-format.ts | 116 +++ .../tree-list/nested/file-uploader-options.ts | 594 ++++++++++++ .../src/ui/tree-list/nested/index.ts | 19 +- .../src/ui/tree-list/nested/item-dxi.ts | 79 ++ .../nested/message-timestamp-format.ts | 116 +++ .../tree-list/nested/send-button-options.ts | 92 ++ .../nested/speech-recognition-config.ts | 107 +++ .../nested/speech-to-text-options.ts | 301 ++++++ ...ng-texts.ts => tree-list-editing-texts.ts} | 11 +- .../ui/tree-list/nested/tree-list-editing.ts | 230 +++++ .../ui/tree-list/nested/typing-user-dxi.ts | 100 ++ .../src/ui/tree-list/nested/user.ts | 99 ++ .../make-angular-metadata.ts | 1 + packages/devextreme-react/src/common/grids.ts | 2 + packages/devextreme-react/src/common/index.ts | 2 + packages/devextreme-react/src/data-grid.ts | 729 +++++++++++++- packages/devextreme-react/src/tree-list.ts | 727 +++++++++++++- packages/devextreme-vue/src/common/grids.ts | 2 + packages/devextreme-vue/src/common/index.ts | 2 + packages/devextreme-vue/src/data-grid.ts | 909 +++++++++++++++++- packages/devextreme-vue/src/tree-list.ts | 905 ++++++++++++++++- packages/devextreme/js/ui/data_grid.d.ts | 1 + .../devextreme/js/ui/data_grid_types.d.ts | 3 +- packages/devextreme/js/ui/tree_list.d.ts | 1 + .../devextreme/js/ui/tree_list_types.d.ts | 3 +- packages/devextreme/ts/dx.all.d.ts | 77 ++ 58 files changed, 9452 insertions(+), 206 deletions(-) create mode 100644 packages/devextreme-angular/src/ui/data-grid/nested/ai-assistant.ts create mode 100644 packages/devextreme-angular/src/ui/data-grid/nested/alert-dxi.ts create mode 100644 packages/devextreme-angular/src/ui/data-grid/nested/attachment-dxi.ts create mode 100644 packages/devextreme-angular/src/ui/data-grid/nested/author.ts create mode 100644 packages/devextreme-angular/src/ui/data-grid/nested/chat-editing.ts create mode 100644 packages/devextreme-angular/src/ui/data-grid/nested/chat-item-dxi.ts create mode 100644 packages/devextreme-angular/src/ui/data-grid/nested/chat.ts create mode 100644 packages/devextreme-angular/src/ui/data-grid/nested/custom-speech-recognizer.ts rename packages/devextreme-angular/src/ui/data-grid/nested/{editing-texts.ts => data-grid-editing-texts.ts} (90%) create mode 100644 packages/devextreme-angular/src/ui/data-grid/nested/data-grid-editing.ts create mode 100644 packages/devextreme-angular/src/ui/data-grid/nested/day-header-format.ts create mode 100644 packages/devextreme-angular/src/ui/data-grid/nested/file-uploader-options.ts create mode 100644 packages/devextreme-angular/src/ui/data-grid/nested/message-timestamp-format.ts create mode 100644 packages/devextreme-angular/src/ui/data-grid/nested/send-button-options.ts create mode 100644 packages/devextreme-angular/src/ui/data-grid/nested/speech-recognition-config.ts create mode 100644 packages/devextreme-angular/src/ui/data-grid/nested/speech-to-text-options.ts create mode 100644 packages/devextreme-angular/src/ui/data-grid/nested/typing-user-dxi.ts create mode 100644 packages/devextreme-angular/src/ui/data-grid/nested/user.ts create mode 100644 packages/devextreme-angular/src/ui/tree-list/nested/ai-assistant.ts create mode 100644 packages/devextreme-angular/src/ui/tree-list/nested/alert-dxi.ts create mode 100644 packages/devextreme-angular/src/ui/tree-list/nested/attachment-dxi.ts create mode 100644 packages/devextreme-angular/src/ui/tree-list/nested/author.ts create mode 100644 packages/devextreme-angular/src/ui/tree-list/nested/chat-editing.ts create mode 100644 packages/devextreme-angular/src/ui/tree-list/nested/chat-item-dxi.ts create mode 100644 packages/devextreme-angular/src/ui/tree-list/nested/chat.ts create mode 100644 packages/devextreme-angular/src/ui/tree-list/nested/custom-speech-recognizer.ts create mode 100644 packages/devextreme-angular/src/ui/tree-list/nested/day-header-format.ts create mode 100644 packages/devextreme-angular/src/ui/tree-list/nested/file-uploader-options.ts create mode 100644 packages/devextreme-angular/src/ui/tree-list/nested/message-timestamp-format.ts create mode 100644 packages/devextreme-angular/src/ui/tree-list/nested/send-button-options.ts create mode 100644 packages/devextreme-angular/src/ui/tree-list/nested/speech-recognition-config.ts create mode 100644 packages/devextreme-angular/src/ui/tree-list/nested/speech-to-text-options.ts rename packages/devextreme-angular/src/ui/tree-list/nested/{editing-texts.ts => tree-list-editing-texts.ts} (91%) create mode 100644 packages/devextreme-angular/src/ui/tree-list/nested/tree-list-editing.ts create mode 100644 packages/devextreme-angular/src/ui/tree-list/nested/typing-user-dxi.ts create mode 100644 packages/devextreme-angular/src/ui/tree-list/nested/user.ts diff --git a/packages/devextreme-angular/src/common/grids/index.ts b/packages/devextreme-angular/src/common/grids/index.ts index 3a0957fda2f1..03696c47816d 100644 --- a/packages/devextreme-angular/src/common/grids/index.ts +++ b/packages/devextreme-angular/src/common/grids/index.ts @@ -1,5 +1,7 @@ export type { AdaptiveDetailRowPreparingInfo, + AIAssistant, + AIAssistantRequestCreatingInfo, AIColumnMode, AIColumnRequestCreatingInfo, ApplyChangesMode, diff --git a/packages/devextreme-angular/src/common/index.ts b/packages/devextreme-angular/src/common/index.ts index 05834113823d..5e3f39ff823e 100644 --- a/packages/devextreme-angular/src/common/index.ts +++ b/packages/devextreme-angular/src/common/index.ts @@ -273,6 +273,8 @@ export namespace Export { export function Grids(): void {} export namespace Grids { export type AdaptiveDetailRowPreparingInfo = GridsModule.AdaptiveDetailRowPreparingInfo; + export type AIAssistant = GridsModule.AIAssistant; + export type AIAssistantRequestCreatingInfo = GridsModule.AIAssistantRequestCreatingInfo; export type AIColumnMode = GridsModule.AIColumnMode; export type AIColumnRequestCreatingInfo = GridsModule.AIColumnRequestCreatingInfo; export type ApplyChangesMode = GridsModule.ApplyChangesMode; diff --git a/packages/devextreme-angular/src/ui/data-grid/index.ts b/packages/devextreme-angular/src/ui/data-grid/index.ts index 4a70db38e603..6821f39c9323 100644 --- a/packages/devextreme-angular/src/ui/data-grid/index.ts +++ b/packages/devextreme-angular/src/ui/data-grid/index.ts @@ -25,9 +25,9 @@ export type { ExplicitTypes } from 'devextreme/ui/data_grid'; import type dxSortable from 'devextreme/ui/sortable'; import type dxDraggable from 'devextreme/ui/draggable'; +import type { AIAssistant, ColumnChooser, ColumnResizeMode, DataChange, GridsEditMode, NewRowPosition, GridsEditRefreshMode, StartEditAction, FilterPanel, ApplyFilterMode, GroupExpandMode, HeaderFilter, EnterKeyAction, EnterKeyDirection, Pager, GridBase, DataRenderMode, SearchPanel, SelectionColumnDisplayMode, Sorting, StateStoreType, SummaryType } from 'devextreme/common/grids'; import type { AIIntegration } from 'devextreme/common/ai-integration'; -import type { ColumnChooser, ColumnResizeMode, DataChange, GridsEditMode, NewRowPosition, GridsEditRefreshMode, StartEditAction, FilterPanel, ApplyFilterMode, GroupExpandMode, HeaderFilter, EnterKeyAction, EnterKeyDirection, Pager, GridBase, DataRenderMode, SearchPanel, SelectionColumnDisplayMode, Sorting, StateStoreType, SummaryType } from 'devextreme/common/grids'; -import type { default as dxDataGrid, dxDataGridColumn, dxDataGridRowObject, DataGridExportFormat, AdaptiveDetailRowPreparingEvent, AIColumnRequestCreatingEvent, CellClickEvent, CellDblClickEvent, CellHoverChangedEvent, CellPreparedEvent, ContentReadyEvent, ContextMenuPreparingEvent, DataErrorOccurredEvent, DisposingEvent, EditCanceledEvent, EditCancelingEvent, EditingStartEvent, EditorPreparedEvent, EditorPreparingEvent, ExportingEvent, FocusedCellChangedEvent, FocusedCellChangingEvent, FocusedRowChangedEvent, FocusedRowChangingEvent, InitializedEvent, InitNewRowEvent, KeyDownEvent, OptionChangedEvent, RowClickEvent, RowCollapsedEvent, RowCollapsingEvent, RowDblClickEvent, RowExpandedEvent, RowExpandingEvent, RowInsertedEvent, RowInsertingEvent, RowPreparedEvent, RowRemovedEvent, RowRemovingEvent, RowUpdatedEvent, RowUpdatingEvent, RowValidatingEvent, SavedEvent, SavingEvent, SelectionChangedEvent, ToolbarPreparingEvent, DataGridScrollMode, SelectionSensitivity, dxDataGridToolbar } from 'devextreme/ui/data_grid'; +import type { default as dxDataGrid, dxDataGridColumn, dxDataGridRowObject, DataGridExportFormat, AdaptiveDetailRowPreparingEvent, AIAssistantRequestCreatingEvent, AIColumnRequestCreatingEvent, CellClickEvent, CellDblClickEvent, CellHoverChangedEvent, CellPreparedEvent, ContentReadyEvent, ContextMenuPreparingEvent, DataErrorOccurredEvent, DisposingEvent, EditCanceledEvent, EditCancelingEvent, EditingStartEvent, EditorPreparedEvent, EditorPreparingEvent, ExportingEvent, FocusedCellChangedEvent, FocusedCellChangingEvent, FocusedRowChangedEvent, FocusedRowChangingEvent, InitializedEvent, InitNewRowEvent, KeyDownEvent, OptionChangedEvent, RowClickEvent, RowCollapsedEvent, RowCollapsingEvent, RowDblClickEvent, RowExpandedEvent, RowExpandingEvent, RowInsertedEvent, RowInsertingEvent, RowPreparedEvent, RowRemovedEvent, RowRemovingEvent, RowUpdatedEvent, RowUpdatingEvent, RowValidatingEvent, SavedEvent, SavingEvent, SelectionChangedEvent, ToolbarPreparingEvent, DataGridScrollMode, SelectionSensitivity, dxDataGridToolbar } from 'devextreme/ui/data_grid'; import type { Mode, DragDirection, DragHighlight, ScrollbarMode, SingleMultipleOrNone, SelectAllMode, SortOrder, HorizontalAlignment } from 'devextreme/common'; import type { default as DataSource, DataSourceOptions } from 'devextreme/data/data_source'; import type { Store } from 'devextreme/data/store'; @@ -118,15 +118,22 @@ import { DxiTotalItemModule } from 'devextreme-angular/ui/nested'; import { DxoToolbarModule } from 'devextreme-angular/ui/nested'; import { DxoDataGridAIModule } from 'devextreme-angular/ui/data-grid/nested'; +import { DxoDataGridAIAssistantModule } from 'devextreme-angular/ui/data-grid/nested'; import { DxoDataGridAIOptionsModule } from 'devextreme-angular/ui/data-grid/nested'; +import { DxiDataGridAlertModule } from 'devextreme-angular/ui/data-grid/nested'; import { DxoDataGridAnimationModule } from 'devextreme-angular/ui/data-grid/nested'; import { DxiDataGridAsyncRuleModule } from 'devextreme-angular/ui/data-grid/nested'; import { DxoDataGridAtModule } from 'devextreme-angular/ui/data-grid/nested'; +import { DxiDataGridAttachmentModule } from 'devextreme-angular/ui/data-grid/nested'; +import { DxoDataGridAuthorModule } from 'devextreme-angular/ui/data-grid/nested'; import { DxoDataGridBoundaryOffsetModule } from 'devextreme-angular/ui/data-grid/nested'; import { DxiDataGridButtonModule } from 'devextreme-angular/ui/data-grid/nested'; import { DxiDataGridButtonItemModule } from 'devextreme-angular/ui/data-grid/nested'; import { DxoDataGridButtonOptionsModule } from 'devextreme-angular/ui/data-grid/nested'; import { DxiDataGridChangeModule } from 'devextreme-angular/ui/data-grid/nested'; +import { DxoDataGridChatModule } from 'devextreme-angular/ui/data-grid/nested'; +import { DxoDataGridChatEditingModule } from 'devextreme-angular/ui/data-grid/nested'; +import { DxiDataGridChatItemModule } from 'devextreme-angular/ui/data-grid/nested'; import { DxoDataGridColCountByScreenModule } from 'devextreme-angular/ui/data-grid/nested'; import { DxoDataGridCollisionModule } from 'devextreme-angular/ui/data-grid/nested'; import { DxiDataGridColumnModule } from 'devextreme-angular/ui/data-grid/nested'; @@ -143,13 +150,16 @@ import { DxiDataGridCompareRuleModule } from 'devextreme-angular/ui/data-grid/ne import { DxoDataGridCursorOffsetModule } from 'devextreme-angular/ui/data-grid/nested'; import { DxiDataGridCustomOperationModule } from 'devextreme-angular/ui/data-grid/nested'; import { DxiDataGridCustomRuleModule } from 'devextreme-angular/ui/data-grid/nested'; +import { DxoDataGridCustomSpeechRecognizerModule } from 'devextreme-angular/ui/data-grid/nested'; +import { DxoDataGridDataGridEditingModule } from 'devextreme-angular/ui/data-grid/nested'; +import { DxoDataGridDataGridEditingTextsModule } from 'devextreme-angular/ui/data-grid/nested'; import { DxoDataGridDataGridHeaderFilterModule } from 'devextreme-angular/ui/data-grid/nested'; import { DxoDataGridDataGridHeaderFilterSearchModule } from 'devextreme-angular/ui/data-grid/nested'; import { DxoDataGridDataGridHeaderFilterTextsModule } from 'devextreme-angular/ui/data-grid/nested'; import { DxoDataGridDataGridSelectionModule } from 'devextreme-angular/ui/data-grid/nested'; import { DxiDataGridDataGridToolbarItemModule } from 'devextreme-angular/ui/data-grid/nested'; +import { DxoDataGridDayHeaderFormatModule } from 'devextreme-angular/ui/data-grid/nested'; import { DxoDataGridEditingModule } from 'devextreme-angular/ui/data-grid/nested'; -import { DxoDataGridEditingTextsModule } from 'devextreme-angular/ui/data-grid/nested'; import { DxoDataGridEditorOptionsModule } from 'devextreme-angular/ui/data-grid/nested'; import { DxiDataGridEditorOptionsButtonModule } from 'devextreme-angular/ui/data-grid/nested'; import { DxiDataGridEmailRuleModule } from 'devextreme-angular/ui/data-grid/nested'; @@ -158,6 +168,7 @@ import { DxoDataGridExportModule } from 'devextreme-angular/ui/data-grid/nested' import { DxoDataGridExportTextsModule } from 'devextreme-angular/ui/data-grid/nested'; import { DxiDataGridFieldModule } from 'devextreme-angular/ui/data-grid/nested'; import { DxoDataGridFieldLookupModule } from 'devextreme-angular/ui/data-grid/nested'; +import { DxoDataGridFileUploaderOptionsModule } from 'devextreme-angular/ui/data-grid/nested'; import { DxoDataGridFilterBuilderModule } from 'devextreme-angular/ui/data-grid/nested'; import { DxoDataGridFilterBuilderPopupModule } from 'devextreme-angular/ui/data-grid/nested'; import { DxoDataGridFilterOperationDescriptionsModule } from 'devextreme-angular/ui/data-grid/nested'; @@ -184,6 +195,7 @@ import { DxoDataGridLabelModule } from 'devextreme-angular/ui/data-grid/nested'; import { DxoDataGridLoadPanelModule } from 'devextreme-angular/ui/data-grid/nested'; import { DxoDataGridLookupModule } from 'devextreme-angular/ui/data-grid/nested'; import { DxoDataGridMasterDetailModule } from 'devextreme-angular/ui/data-grid/nested'; +import { DxoDataGridMessageTimestampFormatModule } from 'devextreme-angular/ui/data-grid/nested'; import { DxoDataGridMyModule } from 'devextreme-angular/ui/data-grid/nested'; import { DxiDataGridNumericRuleModule } from 'devextreme-angular/ui/data-grid/nested'; import { DxoDataGridOffsetModule } from 'devextreme-angular/ui/data-grid/nested'; @@ -202,10 +214,13 @@ import { DxoDataGridScrollingModule } from 'devextreme-angular/ui/data-grid/nest import { DxoDataGridSearchModule } from 'devextreme-angular/ui/data-grid/nested'; import { DxoDataGridSearchPanelModule } from 'devextreme-angular/ui/data-grid/nested'; import { DxoDataGridSelectionModule } from 'devextreme-angular/ui/data-grid/nested'; +import { DxoDataGridSendButtonOptionsModule } from 'devextreme-angular/ui/data-grid/nested'; import { DxoDataGridShowModule } from 'devextreme-angular/ui/data-grid/nested'; import { DxiDataGridSimpleItemModule } from 'devextreme-angular/ui/data-grid/nested'; import { DxiDataGridSortByGroupSummaryInfoModule } from 'devextreme-angular/ui/data-grid/nested'; import { DxoDataGridSortingModule } from 'devextreme-angular/ui/data-grid/nested'; +import { DxoDataGridSpeechRecognitionConfigModule } from 'devextreme-angular/ui/data-grid/nested'; +import { DxoDataGridSpeechToTextOptionsModule } from 'devextreme-angular/ui/data-grid/nested'; import { DxoDataGridStateStoringModule } from 'devextreme-angular/ui/data-grid/nested'; import { DxiDataGridStringLengthRuleModule } from 'devextreme-angular/ui/data-grid/nested'; import { DxoDataGridSummaryModule } from 'devextreme-angular/ui/data-grid/nested'; @@ -219,10 +234,14 @@ import { DxoDataGridToModule } from 'devextreme-angular/ui/data-grid/nested'; import { DxoDataGridToolbarModule } from 'devextreme-angular/ui/data-grid/nested'; import { DxiDataGridToolbarItemModule } from 'devextreme-angular/ui/data-grid/nested'; import { DxiDataGridTotalItemModule } from 'devextreme-angular/ui/data-grid/nested'; +import { DxiDataGridTypingUserModule } from 'devextreme-angular/ui/data-grid/nested'; +import { DxoDataGridUserModule } from 'devextreme-angular/ui/data-grid/nested'; import { DxiDataGridValidationRuleModule } from 'devextreme-angular/ui/data-grid/nested'; import { DxoDataGridValueFormatModule } from 'devextreme-angular/ui/data-grid/nested'; import { + PROPERTY_TOKEN_alerts, PROPERTY_TOKEN_validationRules, + PROPERTY_TOKEN_attachments, PROPERTY_TOKEN_buttons, PROPERTY_TOKEN_items, PROPERTY_TOKEN_changes, @@ -234,6 +253,7 @@ import { PROPERTY_TOKEN_tabs, PROPERTY_TOKEN_toolbarItems, PROPERTY_TOKEN_totalItems, + PROPERTY_TOKEN_typingUsers, } from 'devextreme-angular/core/tokens'; @@ -255,11 +275,21 @@ import { }) export class DxDataGridComponent extends DxComponent implements OnDestroy, OnChanges, DoCheck { + @ContentChildren(PROPERTY_TOKEN_alerts) + set _alertsContentChildren(value: QueryList) { + this.setChildren('alerts', value); + } + @ContentChildren(PROPERTY_TOKEN_validationRules) set _validationRulesContentChildren(value: QueryList) { this.setChildren('validationRules', value); } + @ContentChildren(PROPERTY_TOKEN_attachments) + set _attachmentsContentChildren(value: QueryList) { + this.setChildren('attachments', value); + } + @ContentChildren(PROPERTY_TOKEN_buttons) set _buttonsContentChildren(value: QueryList) { this.setChildren('buttons', value); @@ -315,6 +345,11 @@ export class DxDataGridComponent extends DxComponent this.setChildren('totalItems', value); } + @ContentChildren(PROPERTY_TOKEN_typingUsers) + set _typingUsersContentChildren(value: QueryList) { + this.setChildren('typingUsers', value); + } + instance: DxDataGrid = null; /** @@ -343,6 +378,16 @@ export class DxDataGridComponent extends DxComponent } + + @Input() + get aiAssistant(): AIAssistant { + return this._getOption('aiAssistant'); + } + set aiAssistant(value: AIAssistant) { + this._setOption('aiAssistant', value); + } + + /** * [descr:GridBaseOptions.aiIntegration] @@ -1314,6 +1359,14 @@ export class DxDataGridComponent extends DxComponent */ @Output() onAdaptiveDetailRowPreparing: EventEmitter; + /** + + * [descr:dxDataGridOptions.onAIAssistantRequestCreating] + + + */ + @Output() onAIAssistantRequestCreating: EventEmitter; + /** * [descr:dxDataGridOptions.onAIColumnRequestCreating] @@ -1656,6 +1709,13 @@ export class DxDataGridComponent extends DxComponent */ @Output() activeStateEnabledChange: EventEmitter; + /** + + * This member supports the internal infrastructure and is not intended to be used directly from your code. + + */ + @Output() aiAssistantChange: EventEmitter; + /** * This member supports the internal infrastructure and is not intended to be used directly from your code. @@ -2188,6 +2248,7 @@ export class DxDataGridComponent extends DxComponent this._createEventEmitters([ { subscribe: 'adaptiveDetailRowPreparing', emit: 'onAdaptiveDetailRowPreparing' }, + { subscribe: 'aIAssistantRequestCreating', emit: 'onAIAssistantRequestCreating' }, { subscribe: 'aIColumnRequestCreating', emit: 'onAIColumnRequestCreating' }, { subscribe: 'cellClick', emit: 'onCellClick' }, { subscribe: 'cellDblClick', emit: 'onCellDblClick' }, @@ -2231,6 +2292,7 @@ export class DxDataGridComponent extends DxComponent { subscribe: 'toolbarPreparing', emit: 'onToolbarPreparing' }, { emit: 'accessKeyChange' }, { emit: 'activeStateEnabledChange' }, + { emit: 'aiAssistantChange' }, { emit: 'aiIntegrationChange' }, { emit: 'allowColumnReorderingChange' }, { emit: 'allowColumnResizingChange' }, @@ -2429,15 +2491,22 @@ export class DxDataGridComponent extends DxComponent DxiTotalItemModule, DxoToolbarModule, DxoDataGridAIModule, + DxoDataGridAIAssistantModule, DxoDataGridAIOptionsModule, + DxiDataGridAlertModule, DxoDataGridAnimationModule, DxiDataGridAsyncRuleModule, DxoDataGridAtModule, + DxiDataGridAttachmentModule, + DxoDataGridAuthorModule, DxoDataGridBoundaryOffsetModule, DxiDataGridButtonModule, DxiDataGridButtonItemModule, DxoDataGridButtonOptionsModule, DxiDataGridChangeModule, + DxoDataGridChatModule, + DxoDataGridChatEditingModule, + DxiDataGridChatItemModule, DxoDataGridColCountByScreenModule, DxoDataGridCollisionModule, DxiDataGridColumnModule, @@ -2454,13 +2523,16 @@ export class DxDataGridComponent extends DxComponent DxoDataGridCursorOffsetModule, DxiDataGridCustomOperationModule, DxiDataGridCustomRuleModule, + DxoDataGridCustomSpeechRecognizerModule, + DxoDataGridDataGridEditingModule, + DxoDataGridDataGridEditingTextsModule, DxoDataGridDataGridHeaderFilterModule, DxoDataGridDataGridHeaderFilterSearchModule, DxoDataGridDataGridHeaderFilterTextsModule, DxoDataGridDataGridSelectionModule, DxiDataGridDataGridToolbarItemModule, + DxoDataGridDayHeaderFormatModule, DxoDataGridEditingModule, - DxoDataGridEditingTextsModule, DxoDataGridEditorOptionsModule, DxiDataGridEditorOptionsButtonModule, DxiDataGridEmailRuleModule, @@ -2469,6 +2541,7 @@ export class DxDataGridComponent extends DxComponent DxoDataGridExportTextsModule, DxiDataGridFieldModule, DxoDataGridFieldLookupModule, + DxoDataGridFileUploaderOptionsModule, DxoDataGridFilterBuilderModule, DxoDataGridFilterBuilderPopupModule, DxoDataGridFilterOperationDescriptionsModule, @@ -2495,6 +2568,7 @@ export class DxDataGridComponent extends DxComponent DxoDataGridLoadPanelModule, DxoDataGridLookupModule, DxoDataGridMasterDetailModule, + DxoDataGridMessageTimestampFormatModule, DxoDataGridMyModule, DxiDataGridNumericRuleModule, DxoDataGridOffsetModule, @@ -2513,10 +2587,13 @@ export class DxDataGridComponent extends DxComponent DxoDataGridSearchModule, DxoDataGridSearchPanelModule, DxoDataGridSelectionModule, + DxoDataGridSendButtonOptionsModule, DxoDataGridShowModule, DxiDataGridSimpleItemModule, DxiDataGridSortByGroupSummaryInfoModule, DxoDataGridSortingModule, + DxoDataGridSpeechRecognitionConfigModule, + DxoDataGridSpeechToTextOptionsModule, DxoDataGridStateStoringModule, DxiDataGridStringLengthRuleModule, DxoDataGridSummaryModule, @@ -2530,6 +2607,8 @@ export class DxDataGridComponent extends DxComponent DxoDataGridToolbarModule, DxiDataGridToolbarItemModule, DxiDataGridTotalItemModule, + DxiDataGridTypingUserModule, + DxoDataGridUserModule, DxiDataGridValidationRuleModule, DxoDataGridValueFormatModule, DxIntegrationModule, @@ -2602,15 +2681,22 @@ export class DxDataGridComponent extends DxComponent DxiTotalItemModule, DxoToolbarModule, DxoDataGridAIModule, + DxoDataGridAIAssistantModule, DxoDataGridAIOptionsModule, + DxiDataGridAlertModule, DxoDataGridAnimationModule, DxiDataGridAsyncRuleModule, DxoDataGridAtModule, + DxiDataGridAttachmentModule, + DxoDataGridAuthorModule, DxoDataGridBoundaryOffsetModule, DxiDataGridButtonModule, DxiDataGridButtonItemModule, DxoDataGridButtonOptionsModule, DxiDataGridChangeModule, + DxoDataGridChatModule, + DxoDataGridChatEditingModule, + DxiDataGridChatItemModule, DxoDataGridColCountByScreenModule, DxoDataGridCollisionModule, DxiDataGridColumnModule, @@ -2627,13 +2713,16 @@ export class DxDataGridComponent extends DxComponent DxoDataGridCursorOffsetModule, DxiDataGridCustomOperationModule, DxiDataGridCustomRuleModule, + DxoDataGridCustomSpeechRecognizerModule, + DxoDataGridDataGridEditingModule, + DxoDataGridDataGridEditingTextsModule, DxoDataGridDataGridHeaderFilterModule, DxoDataGridDataGridHeaderFilterSearchModule, DxoDataGridDataGridHeaderFilterTextsModule, DxoDataGridDataGridSelectionModule, DxiDataGridDataGridToolbarItemModule, + DxoDataGridDayHeaderFormatModule, DxoDataGridEditingModule, - DxoDataGridEditingTextsModule, DxoDataGridEditorOptionsModule, DxiDataGridEditorOptionsButtonModule, DxiDataGridEmailRuleModule, @@ -2642,6 +2731,7 @@ export class DxDataGridComponent extends DxComponent DxoDataGridExportTextsModule, DxiDataGridFieldModule, DxoDataGridFieldLookupModule, + DxoDataGridFileUploaderOptionsModule, DxoDataGridFilterBuilderModule, DxoDataGridFilterBuilderPopupModule, DxoDataGridFilterOperationDescriptionsModule, @@ -2668,6 +2758,7 @@ export class DxDataGridComponent extends DxComponent DxoDataGridLoadPanelModule, DxoDataGridLookupModule, DxoDataGridMasterDetailModule, + DxoDataGridMessageTimestampFormatModule, DxoDataGridMyModule, DxiDataGridNumericRuleModule, DxoDataGridOffsetModule, @@ -2686,10 +2777,13 @@ export class DxDataGridComponent extends DxComponent DxoDataGridSearchModule, DxoDataGridSearchPanelModule, DxoDataGridSelectionModule, + DxoDataGridSendButtonOptionsModule, DxoDataGridShowModule, DxiDataGridSimpleItemModule, DxiDataGridSortByGroupSummaryInfoModule, DxoDataGridSortingModule, + DxoDataGridSpeechRecognitionConfigModule, + DxoDataGridSpeechToTextOptionsModule, DxoDataGridStateStoringModule, DxiDataGridStringLengthRuleModule, DxoDataGridSummaryModule, @@ -2703,6 +2797,8 @@ export class DxDataGridComponent extends DxComponent DxoDataGridToolbarModule, DxiDataGridToolbarItemModule, DxiDataGridTotalItemModule, + DxiDataGridTypingUserModule, + DxoDataGridUserModule, DxiDataGridValidationRuleModule, DxoDataGridValueFormatModule, DxTemplateModule diff --git a/packages/devextreme-angular/src/ui/data-grid/nested/ai-assistant.ts b/packages/devextreme-angular/src/ui/data-grid/nested/ai-assistant.ts new file mode 100644 index 000000000000..305e6823ffe4 --- /dev/null +++ b/packages/devextreme-angular/src/ui/data-grid/nested/ai-assistant.ts @@ -0,0 +1,110 @@ +/* tslint:disable:max-line-length */ + + +import { + Component, + OnInit, + OnDestroy, + NgModule, + Host, + SkipSelf, + Input +} from '@angular/core'; + + + + +import type { AIIntegration } from 'devextreme/common/ai-integration'; +import type { dxChatOptions } from 'devextreme/ui/chat'; +import type { dxPopupOptions } from 'devextreme/ui/popup'; + +import { + DxIntegrationModule, + NestedOptionHost, +} from 'devextreme-angular/core'; +import { NestedOption } from 'devextreme-angular/core'; + + +@Component({ + selector: 'dxo-data-grid-ai-assistant', + standalone: true, + template: '', + styles: [''], + imports: [ DxIntegrationModule ], + providers: [NestedOptionHost] +}) +export class DxoDataGridAIAssistantComponent extends NestedOption implements OnDestroy, OnInit { + @Input() + get aiIntegration(): AIIntegration { + return this._getOption('aiIntegration'); + } + set aiIntegration(value: AIIntegration) { + this._setOption('aiIntegration', value); + } + + @Input() + get chat(): dxChatOptions { + return this._getOption('chat'); + } + set chat(value: dxChatOptions) { + this._setOption('chat', value); + } + + @Input() + get enabled(): boolean { + return this._getOption('enabled'); + } + set enabled(value: boolean) { + this._setOption('enabled', value); + } + + @Input() + get popup(): dxPopupOptions { + return this._getOption('popup'); + } + set popup(value: dxPopupOptions) { + this._setOption('popup', value); + } + + @Input() + get title(): string { + return this._getOption('title'); + } + set title(value: string) { + this._setOption('title', value); + } + + + protected get _optionPath() { + return 'aiAssistant'; + } + + + constructor(@SkipSelf() @Host() parentOptionHost: NestedOptionHost, + @Host() optionHost: NestedOptionHost) { + super(); + parentOptionHost.setNestedOption(this); + optionHost.setHost(this, this._fullOptionPath.bind(this)); + } + + + ngOnInit() { + this._addRecreatedComponent(); + } + + ngOnDestroy() { + this._addRemovedOption(this._getOptionPath()); + } + + +} + +@NgModule({ + imports: [ + DxoDataGridAIAssistantComponent + ], + exports: [ + DxoDataGridAIAssistantComponent + ], +}) +export class DxoDataGridAIAssistantModule { } diff --git a/packages/devextreme-angular/src/ui/data-grid/nested/alert-dxi.ts b/packages/devextreme-angular/src/ui/data-grid/nested/alert-dxi.ts new file mode 100644 index 000000000000..8e4fb0efad25 --- /dev/null +++ b/packages/devextreme-angular/src/ui/data-grid/nested/alert-dxi.ts @@ -0,0 +1,84 @@ +/* tslint:disable:max-line-length */ + + +import { + Component, + NgModule, + Host, + SkipSelf, + Input +} from '@angular/core'; + + + + + +import { + DxIntegrationModule, + NestedOptionHost, +} from 'devextreme-angular/core'; +import { CollectionNestedOption } from 'devextreme-angular/core'; + +import { PROPERTY_TOKEN_alerts } from 'devextreme-angular/core/tokens'; + +@Component({ + selector: 'dxi-data-grid-alert', + standalone: true, + template: '', + styles: [''], + imports: [ DxIntegrationModule ], + providers: [ + NestedOptionHost, + { + provide: PROPERTY_TOKEN_alerts, + useExisting: DxiDataGridAlertComponent, + } + ] +}) +export class DxiDataGridAlertComponent extends CollectionNestedOption { + @Input() + get id(): number | string { + return this._getOption('id'); + } + set id(value: number | string) { + this._setOption('id', value); + } + + @Input() + get message(): string { + return this._getOption('message'); + } + set message(value: string) { + this._setOption('message', value); + } + + + protected get _optionPath() { + return 'alerts'; + } + + + constructor(@SkipSelf() @Host() parentOptionHost: NestedOptionHost, + @Host() optionHost: NestedOptionHost) { + super(); + parentOptionHost.setNestedOption(this); + optionHost.setHost(this, this._fullOptionPath.bind(this)); + } + + + + ngOnDestroy() { + this._deleteRemovedOptions(this._fullOptionPath()); + } + +} + +@NgModule({ + imports: [ + DxiDataGridAlertComponent + ], + exports: [ + DxiDataGridAlertComponent + ], +}) +export class DxiDataGridAlertModule { } diff --git a/packages/devextreme-angular/src/ui/data-grid/nested/attachment-dxi.ts b/packages/devextreme-angular/src/ui/data-grid/nested/attachment-dxi.ts new file mode 100644 index 000000000000..5734d3878ab6 --- /dev/null +++ b/packages/devextreme-angular/src/ui/data-grid/nested/attachment-dxi.ts @@ -0,0 +1,84 @@ +/* tslint:disable:max-line-length */ + + +import { + Component, + NgModule, + Host, + SkipSelf, + Input +} from '@angular/core'; + + + + + +import { + DxIntegrationModule, + NestedOptionHost, +} from 'devextreme-angular/core'; +import { CollectionNestedOption } from 'devextreme-angular/core'; + +import { PROPERTY_TOKEN_attachments } from 'devextreme-angular/core/tokens'; + +@Component({ + selector: 'dxi-data-grid-attachment', + standalone: true, + template: '', + styles: [''], + imports: [ DxIntegrationModule ], + providers: [ + NestedOptionHost, + { + provide: PROPERTY_TOKEN_attachments, + useExisting: DxiDataGridAttachmentComponent, + } + ] +}) +export class DxiDataGridAttachmentComponent extends CollectionNestedOption { + @Input() + get name(): string { + return this._getOption('name'); + } + set name(value: string) { + this._setOption('name', value); + } + + @Input() + get size(): number { + return this._getOption('size'); + } + set size(value: number) { + this._setOption('size', value); + } + + + protected get _optionPath() { + return 'attachments'; + } + + + constructor(@SkipSelf() @Host() parentOptionHost: NestedOptionHost, + @Host() optionHost: NestedOptionHost) { + super(); + parentOptionHost.setNestedOption(this); + optionHost.setHost(this, this._fullOptionPath.bind(this)); + } + + + + ngOnDestroy() { + this._deleteRemovedOptions(this._fullOptionPath()); + } + +} + +@NgModule({ + imports: [ + DxiDataGridAttachmentComponent + ], + exports: [ + DxiDataGridAttachmentComponent + ], +}) +export class DxiDataGridAttachmentModule { } diff --git a/packages/devextreme-angular/src/ui/data-grid/nested/author.ts b/packages/devextreme-angular/src/ui/data-grid/nested/author.ts new file mode 100644 index 000000000000..7b1f2efc3a16 --- /dev/null +++ b/packages/devextreme-angular/src/ui/data-grid/nested/author.ts @@ -0,0 +1,99 @@ +/* tslint:disable:max-line-length */ + + +import { + Component, + OnInit, + OnDestroy, + NgModule, + Host, + SkipSelf, + Input +} from '@angular/core'; + + + + + +import { + DxIntegrationModule, + NestedOptionHost, +} from 'devextreme-angular/core'; +import { NestedOption } from 'devextreme-angular/core'; + + +@Component({ + selector: 'dxo-data-grid-author', + standalone: true, + template: '', + styles: [''], + imports: [ DxIntegrationModule ], + providers: [NestedOptionHost] +}) +export class DxoDataGridAuthorComponent extends NestedOption implements OnDestroy, OnInit { + @Input() + get avatarAlt(): string { + return this._getOption('avatarAlt'); + } + set avatarAlt(value: string) { + this._setOption('avatarAlt', value); + } + + @Input() + get avatarUrl(): string { + return this._getOption('avatarUrl'); + } + set avatarUrl(value: string) { + this._setOption('avatarUrl', value); + } + + @Input() + get id(): number | string { + return this._getOption('id'); + } + set id(value: number | string) { + this._setOption('id', value); + } + + @Input() + get name(): string { + return this._getOption('name'); + } + set name(value: string) { + this._setOption('name', value); + } + + + protected get _optionPath() { + return 'author'; + } + + + constructor(@SkipSelf() @Host() parentOptionHost: NestedOptionHost, + @Host() optionHost: NestedOptionHost) { + super(); + parentOptionHost.setNestedOption(this); + optionHost.setHost(this, this._fullOptionPath.bind(this)); + } + + + ngOnInit() { + this._addRecreatedComponent(); + } + + ngOnDestroy() { + this._addRemovedOption(this._getOptionPath()); + } + + +} + +@NgModule({ + imports: [ + DxoDataGridAuthorComponent + ], + exports: [ + DxoDataGridAuthorComponent + ], +}) +export class DxoDataGridAuthorModule { } diff --git a/packages/devextreme-angular/src/ui/data-grid/nested/chat-editing.ts b/packages/devextreme-angular/src/ui/data-grid/nested/chat-editing.ts new file mode 100644 index 000000000000..43a9ccdd6257 --- /dev/null +++ b/packages/devextreme-angular/src/ui/data-grid/nested/chat-editing.ts @@ -0,0 +1,84 @@ +/* tslint:disable:max-line-length */ + + +import { + Component, + OnInit, + OnDestroy, + NgModule, + Host, + SkipSelf, + Input +} from '@angular/core'; + + + + +import type { default as dxChat, Message } from 'devextreme/ui/chat'; + +import { + DxIntegrationModule, + NestedOptionHost, +} from 'devextreme-angular/core'; +import { NestedOption } from 'devextreme-angular/core'; + + +@Component({ + selector: 'dxo-data-grid-chat-editing', + standalone: true, + template: '', + styles: [''], + imports: [ DxIntegrationModule ], + providers: [NestedOptionHost] +}) +export class DxoDataGridChatEditingComponent extends NestedOption implements OnDestroy, OnInit { + @Input() + get allowDeleting(): boolean | ((options: { component: dxChat, message: Message }) => boolean) { + return this._getOption('allowDeleting'); + } + set allowDeleting(value: boolean | ((options: { component: dxChat, message: Message }) => boolean)) { + this._setOption('allowDeleting', value); + } + + @Input() + get allowUpdating(): boolean | ((options: { component: dxChat, message: Message }) => boolean) { + return this._getOption('allowUpdating'); + } + set allowUpdating(value: boolean | ((options: { component: dxChat, message: Message }) => boolean)) { + this._setOption('allowUpdating', value); + } + + + protected get _optionPath() { + return 'editing'; + } + + + constructor(@SkipSelf() @Host() parentOptionHost: NestedOptionHost, + @Host() optionHost: NestedOptionHost) { + super(); + parentOptionHost.setNestedOption(this); + optionHost.setHost(this, this._fullOptionPath.bind(this)); + } + + + ngOnInit() { + this._addRecreatedComponent(); + } + + ngOnDestroy() { + this._addRemovedOption(this._getOptionPath()); + } + + +} + +@NgModule({ + imports: [ + DxoDataGridChatEditingComponent + ], + exports: [ + DxoDataGridChatEditingComponent + ], +}) +export class DxoDataGridChatEditingModule { } diff --git a/packages/devextreme-angular/src/ui/data-grid/nested/chat-item-dxi.ts b/packages/devextreme-angular/src/ui/data-grid/nested/chat-item-dxi.ts new file mode 100644 index 000000000000..890f18e4ab4a --- /dev/null +++ b/packages/devextreme-angular/src/ui/data-grid/nested/chat-item-dxi.ts @@ -0,0 +1,159 @@ +/* tslint:disable:max-line-length */ + + +import { + Component, + NgModule, + Host, + SkipSelf, + Input, + ContentChildren, + QueryList +} from '@angular/core'; + + + + +import type { Attachment, User } from 'devextreme/ui/chat'; + +import { + DxIntegrationModule, + NestedOptionHost, +} from 'devextreme-angular/core'; +import { CollectionNestedOption } from 'devextreme-angular/core'; + +import { PROPERTY_TOKEN_items } from 'devextreme-angular/core/tokens'; +import { + PROPERTY_TOKEN_attachments, +} from 'devextreme-angular/core/tokens'; + +@Component({ + selector: 'dxi-data-grid-chat-item', + standalone: true, + template: '', + styles: [''], + imports: [ DxIntegrationModule ], + providers: [ + NestedOptionHost, + { + provide: PROPERTY_TOKEN_items, + useExisting: DxiDataGridChatItemComponent, + } + ] +}) +export class DxiDataGridChatItemComponent extends CollectionNestedOption { + @ContentChildren(PROPERTY_TOKEN_attachments) + set _attachmentsContentChildren(value: QueryList) { + this.setChildren('attachments', value); + } + + @Input() + get alt(): string { + return this._getOption('alt'); + } + set alt(value: string) { + this._setOption('alt', value); + } + + @Input() + get attachments(): Array { + return this._getOption('attachments'); + } + set attachments(value: Array) { + this._setOption('attachments', value); + } + + @Input() + get author(): User { + return this._getOption('author'); + } + set author(value: User) { + this._setOption('author', value); + } + + @Input() + get id(): number | string { + return this._getOption('id'); + } + set id(value: number | string) { + this._setOption('id', value); + } + + @Input() + get isDeleted(): boolean { + return this._getOption('isDeleted'); + } + set isDeleted(value: boolean) { + this._setOption('isDeleted', value); + } + + @Input() + get isEdited(): boolean { + return this._getOption('isEdited'); + } + set isEdited(value: boolean) { + this._setOption('isEdited', value); + } + + @Input() + get src(): string { + return this._getOption('src'); + } + set src(value: string) { + this._setOption('src', value); + } + + @Input() + get text(): string { + return this._getOption('text'); + } + set text(value: string) { + this._setOption('text', value); + } + + @Input() + get timestamp(): Date | number | string { + return this._getOption('timestamp'); + } + set timestamp(value: Date | number | string) { + this._setOption('timestamp', value); + } + + @Input() + get type(): string | undefined { + return this._getOption('type'); + } + set type(value: string | undefined) { + this._setOption('type', value); + } + + + protected get _optionPath() { + return 'items'; + } + + + constructor(@SkipSelf() @Host() parentOptionHost: NestedOptionHost, + @Host() optionHost: NestedOptionHost) { + super(); + parentOptionHost.setNestedOption(this); + optionHost.setHost(this, this._fullOptionPath.bind(this)); + } + + + + ngOnDestroy() { + this._deleteRemovedOptions(this._fullOptionPath()); + } + +} + +@NgModule({ + imports: [ + DxiDataGridChatItemComponent + ], + exports: [ + DxiDataGridChatItemComponent + ], +}) +export class DxiDataGridChatItemModule { } diff --git a/packages/devextreme-angular/src/ui/data-grid/nested/chat.ts b/packages/devextreme-angular/src/ui/data-grid/nested/chat.ts new file mode 100644 index 000000000000..994b158484b5 --- /dev/null +++ b/packages/devextreme-angular/src/ui/data-grid/nested/chat.ts @@ -0,0 +1,468 @@ +/* tslint:disable:max-line-length */ + + +import { + Component, + OnInit, + OnDestroy, + NgModule, + Host, + SkipSelf, + Input, + Output, + EventEmitter, + ContentChildren, + QueryList +} from '@angular/core'; + + + + +import type { default as dxChat, Alert, Message, AttachmentDownloadClickEvent, DisposingEvent, InitializedEvent, InputFieldTextChangedEvent, MessageDeletedEvent, MessageDeletingEvent, MessageEditCanceledEvent, MessageEditingStartEvent, MessageEnteredEvent, MessageUpdatedEvent, MessageUpdatingEvent, OptionChangedEvent, TypingEndEvent, TypingStartEvent, SendButtonProperties, User } from 'devextreme/ui/chat'; +import type { default as DataSource, DataSourceOptions } from 'devextreme/data/data_source'; +import type { Store } from 'devextreme/data/store'; +import type { Format } from 'devextreme/common/core/localization'; +import type { dxFileUploaderOptions } from 'devextreme/ui/file_uploader'; +import type { dxSpeechToTextOptions } from 'devextreme/ui/speech_to_text'; + +import { + DxIntegrationModule, + NestedOptionHost, + CollectionNestedOption, +} from 'devextreme-angular/core'; +import { NestedOption } from 'devextreme-angular/core'; + +import { + PROPERTY_TOKEN_alerts, + PROPERTY_TOKEN_items, + PROPERTY_TOKEN_typingUsers, +} from 'devextreme-angular/core/tokens'; + +@Component({ + selector: 'dxo-data-grid-chat', + standalone: true, + template: '', + styles: [''], + imports: [ DxIntegrationModule ], + providers: [NestedOptionHost] +}) +export class DxoDataGridChatComponent extends NestedOption implements OnDestroy, OnInit { + @ContentChildren(PROPERTY_TOKEN_alerts) + set _alertsContentChildren(value: QueryList) { + this.setChildren('alerts', value); + } + + @ContentChildren(PROPERTY_TOKEN_items) + set _itemsContentChildren(value: QueryList) { + this.setChildren('items', value); + } + + @ContentChildren(PROPERTY_TOKEN_typingUsers) + set _typingUsersContentChildren(value: QueryList) { + this.setChildren('typingUsers', value); + } + + @Input() + get accessKey(): string | undefined { + return this._getOption('accessKey'); + } + set accessKey(value: string | undefined) { + this._setOption('accessKey', value); + } + + @Input() + get activeStateEnabled(): boolean { + return this._getOption('activeStateEnabled'); + } + set activeStateEnabled(value: boolean) { + this._setOption('activeStateEnabled', value); + } + + @Input() + get alerts(): Array { + return this._getOption('alerts'); + } + set alerts(value: Array) { + this._setOption('alerts', value); + } + + @Input() + get dataSource(): Array | DataSource | DataSourceOptions | null | Store | string { + return this._getOption('dataSource'); + } + set dataSource(value: Array | DataSource | DataSourceOptions | null | Store | string) { + this._setOption('dataSource', value); + } + + @Input() + get dayHeaderFormat(): Format { + return this._getOption('dayHeaderFormat'); + } + set dayHeaderFormat(value: Format) { + this._setOption('dayHeaderFormat', value); + } + + @Input() + get disabled(): boolean { + return this._getOption('disabled'); + } + set disabled(value: boolean) { + this._setOption('disabled', value); + } + + @Input() + get editing(): { allowDeleting?: boolean | ((options: { component: dxChat, message: Message }) => boolean), allowUpdating?: boolean | ((options: { component: dxChat, message: Message }) => boolean) } { + return this._getOption('editing'); + } + set editing(value: { allowDeleting?: boolean | ((options: { component: dxChat, message: Message }) => boolean), allowUpdating?: boolean | ((options: { component: dxChat, message: Message }) => boolean) }) { + this._setOption('editing', value); + } + + @Input() + get elementAttr(): Record { + return this._getOption('elementAttr'); + } + set elementAttr(value: Record) { + this._setOption('elementAttr', value); + } + + @Input() + get emptyViewTemplate(): any { + return this._getOption('emptyViewTemplate'); + } + set emptyViewTemplate(value: any) { + this._setOption('emptyViewTemplate', value); + } + + @Input() + get fileUploaderOptions(): dxFileUploaderOptions { + return this._getOption('fileUploaderOptions'); + } + set fileUploaderOptions(value: dxFileUploaderOptions) { + this._setOption('fileUploaderOptions', value); + } + + @Input() + get focusStateEnabled(): boolean { + return this._getOption('focusStateEnabled'); + } + set focusStateEnabled(value: boolean) { + this._setOption('focusStateEnabled', value); + } + + @Input() + get height(): number | string | undefined { + return this._getOption('height'); + } + set height(value: number | string | undefined) { + this._setOption('height', value); + } + + @Input() + get hint(): string | undefined { + return this._getOption('hint'); + } + set hint(value: string | undefined) { + this._setOption('hint', value); + } + + @Input() + get hoverStateEnabled(): boolean { + return this._getOption('hoverStateEnabled'); + } + set hoverStateEnabled(value: boolean) { + this._setOption('hoverStateEnabled', value); + } + + @Input() + get inputFieldText(): string | undefined { + return this._getOption('inputFieldText'); + } + set inputFieldText(value: string | undefined) { + this._setOption('inputFieldText', value); + } + + @Input() + get items(): Array { + return this._getOption('items'); + } + set items(value: Array) { + this._setOption('items', value); + } + + @Input() + get messageTemplate(): any { + return this._getOption('messageTemplate'); + } + set messageTemplate(value: any) { + this._setOption('messageTemplate', value); + } + + @Input() + get messageTimestampFormat(): Format { + return this._getOption('messageTimestampFormat'); + } + set messageTimestampFormat(value: Format) { + this._setOption('messageTimestampFormat', value); + } + + @Input() + get onAttachmentDownloadClick(): ((e: AttachmentDownloadClickEvent) => void) | undefined { + return this._getOption('onAttachmentDownloadClick'); + } + set onAttachmentDownloadClick(value: ((e: AttachmentDownloadClickEvent) => void) | undefined) { + this._setOption('onAttachmentDownloadClick', value); + } + + @Input() + get onDisposing(): ((e: DisposingEvent) => void) { + return this._getOption('onDisposing'); + } + set onDisposing(value: ((e: DisposingEvent) => void)) { + this._setOption('onDisposing', value); + } + + @Input() + get onInitialized(): ((e: InitializedEvent) => void) { + return this._getOption('onInitialized'); + } + set onInitialized(value: ((e: InitializedEvent) => void)) { + this._setOption('onInitialized', value); + } + + @Input() + get onInputFieldTextChanged(): ((e: InputFieldTextChangedEvent) => void) | undefined { + return this._getOption('onInputFieldTextChanged'); + } + set onInputFieldTextChanged(value: ((e: InputFieldTextChangedEvent) => void) | undefined) { + this._setOption('onInputFieldTextChanged', value); + } + + @Input() + get onMessageDeleted(): ((e: MessageDeletedEvent) => void) | undefined { + return this._getOption('onMessageDeleted'); + } + set onMessageDeleted(value: ((e: MessageDeletedEvent) => void) | undefined) { + this._setOption('onMessageDeleted', value); + } + + @Input() + get onMessageDeleting(): ((e: MessageDeletingEvent) => void) | undefined { + return this._getOption('onMessageDeleting'); + } + set onMessageDeleting(value: ((e: MessageDeletingEvent) => void) | undefined) { + this._setOption('onMessageDeleting', value); + } + + @Input() + get onMessageEditCanceled(): ((e: MessageEditCanceledEvent) => void) | undefined { + return this._getOption('onMessageEditCanceled'); + } + set onMessageEditCanceled(value: ((e: MessageEditCanceledEvent) => void) | undefined) { + this._setOption('onMessageEditCanceled', value); + } + + @Input() + get onMessageEditingStart(): ((e: MessageEditingStartEvent) => void) | undefined { + return this._getOption('onMessageEditingStart'); + } + set onMessageEditingStart(value: ((e: MessageEditingStartEvent) => void) | undefined) { + this._setOption('onMessageEditingStart', value); + } + + @Input() + get onMessageEntered(): ((e: MessageEnteredEvent) => void) | undefined { + return this._getOption('onMessageEntered'); + } + set onMessageEntered(value: ((e: MessageEnteredEvent) => void) | undefined) { + this._setOption('onMessageEntered', value); + } + + @Input() + get onMessageUpdated(): ((e: MessageUpdatedEvent) => void) | undefined { + return this._getOption('onMessageUpdated'); + } + set onMessageUpdated(value: ((e: MessageUpdatedEvent) => void) | undefined) { + this._setOption('onMessageUpdated', value); + } + + @Input() + get onMessageUpdating(): ((e: MessageUpdatingEvent) => void) | undefined { + return this._getOption('onMessageUpdating'); + } + set onMessageUpdating(value: ((e: MessageUpdatingEvent) => void) | undefined) { + this._setOption('onMessageUpdating', value); + } + + @Input() + get onOptionChanged(): ((e: OptionChangedEvent) => void) { + return this._getOption('onOptionChanged'); + } + set onOptionChanged(value: ((e: OptionChangedEvent) => void)) { + this._setOption('onOptionChanged', value); + } + + @Input() + get onTypingEnd(): ((e: TypingEndEvent) => void) | undefined { + return this._getOption('onTypingEnd'); + } + set onTypingEnd(value: ((e: TypingEndEvent) => void) | undefined) { + this._setOption('onTypingEnd', value); + } + + @Input() + get onTypingStart(): ((e: TypingStartEvent) => void) | undefined { + return this._getOption('onTypingStart'); + } + set onTypingStart(value: ((e: TypingStartEvent) => void) | undefined) { + this._setOption('onTypingStart', value); + } + + @Input() + get reloadOnChange(): boolean { + return this._getOption('reloadOnChange'); + } + set reloadOnChange(value: boolean) { + this._setOption('reloadOnChange', value); + } + + @Input() + get rtlEnabled(): boolean { + return this._getOption('rtlEnabled'); + } + set rtlEnabled(value: boolean) { + this._setOption('rtlEnabled', value); + } + + @Input() + get sendButtonOptions(): SendButtonProperties { + return this._getOption('sendButtonOptions'); + } + set sendButtonOptions(value: SendButtonProperties) { + this._setOption('sendButtonOptions', value); + } + + @Input() + get showAvatar(): boolean { + return this._getOption('showAvatar'); + } + set showAvatar(value: boolean) { + this._setOption('showAvatar', value); + } + + @Input() + get showDayHeaders(): boolean { + return this._getOption('showDayHeaders'); + } + set showDayHeaders(value: boolean) { + this._setOption('showDayHeaders', value); + } + + @Input() + get showMessageTimestamp(): boolean { + return this._getOption('showMessageTimestamp'); + } + set showMessageTimestamp(value: boolean) { + this._setOption('showMessageTimestamp', value); + } + + @Input() + get showUserName(): boolean { + return this._getOption('showUserName'); + } + set showUserName(value: boolean) { + this._setOption('showUserName', value); + } + + @Input() + get speechToTextEnabled(): boolean { + return this._getOption('speechToTextEnabled'); + } + set speechToTextEnabled(value: boolean) { + this._setOption('speechToTextEnabled', value); + } + + @Input() + get speechToTextOptions(): dxSpeechToTextOptions { + return this._getOption('speechToTextOptions'); + } + set speechToTextOptions(value: dxSpeechToTextOptions) { + this._setOption('speechToTextOptions', value); + } + + @Input() + get typingUsers(): Array { + return this._getOption('typingUsers'); + } + set typingUsers(value: Array) { + this._setOption('typingUsers', value); + } + + @Input() + get user(): User { + return this._getOption('user'); + } + set user(value: User) { + this._setOption('user', value); + } + + @Input() + get visible(): boolean { + return this._getOption('visible'); + } + set visible(value: boolean) { + this._setOption('visible', value); + } + + @Input() + get width(): number | string | undefined { + return this._getOption('width'); + } + set width(value: number | string | undefined) { + this._setOption('width', value); + } + + + /** + + * This member supports the internal infrastructure and is not intended to be used directly from your code. + + */ + @Output() itemsChange: EventEmitter>; + protected get _optionPath() { + return 'chat'; + } + + + constructor(@SkipSelf() @Host() parentOptionHost: NestedOptionHost, + @Host() optionHost: NestedOptionHost) { + super(); + this._createEventEmitters([ + { emit: 'itemsChange' } + ]); + + parentOptionHost.setNestedOption(this); + optionHost.setHost(this, this._fullOptionPath.bind(this)); + } + + + ngOnInit() { + this._addRecreatedComponent(); + } + + ngOnDestroy() { + this._addRemovedOption(this._getOptionPath()); + } + + +} + +@NgModule({ + imports: [ + DxoDataGridChatComponent + ], + exports: [ + DxoDataGridChatComponent + ], +}) +export class DxoDataGridChatModule { } diff --git a/packages/devextreme-angular/src/ui/data-grid/nested/custom-speech-recognizer.ts b/packages/devextreme-angular/src/ui/data-grid/nested/custom-speech-recognizer.ts new file mode 100644 index 000000000000..4e43f0302a15 --- /dev/null +++ b/packages/devextreme-angular/src/ui/data-grid/nested/custom-speech-recognizer.ts @@ -0,0 +1,83 @@ +/* tslint:disable:max-line-length */ + + +import { + Component, + OnInit, + OnDestroy, + NgModule, + Host, + SkipSelf, + Input +} from '@angular/core'; + + + + + +import { + DxIntegrationModule, + NestedOptionHost, +} from 'devextreme-angular/core'; +import { NestedOption } from 'devextreme-angular/core'; + + +@Component({ + selector: 'dxo-data-grid-custom-speech-recognizer', + standalone: true, + template: '', + styles: [''], + imports: [ DxIntegrationModule ], + providers: [NestedOptionHost] +}) +export class DxoDataGridCustomSpeechRecognizerComponent extends NestedOption implements OnDestroy, OnInit { + @Input() + get enabled(): boolean { + return this._getOption('enabled'); + } + set enabled(value: boolean) { + this._setOption('enabled', value); + } + + @Input() + get isListening(): boolean { + return this._getOption('isListening'); + } + set isListening(value: boolean) { + this._setOption('isListening', value); + } + + + protected get _optionPath() { + return 'customSpeechRecognizer'; + } + + + constructor(@SkipSelf() @Host() parentOptionHost: NestedOptionHost, + @Host() optionHost: NestedOptionHost) { + super(); + parentOptionHost.setNestedOption(this); + optionHost.setHost(this, this._fullOptionPath.bind(this)); + } + + + ngOnInit() { + this._addRecreatedComponent(); + } + + ngOnDestroy() { + this._addRemovedOption(this._getOptionPath()); + } + + +} + +@NgModule({ + imports: [ + DxoDataGridCustomSpeechRecognizerComponent + ], + exports: [ + DxoDataGridCustomSpeechRecognizerComponent + ], +}) +export class DxoDataGridCustomSpeechRecognizerModule { } diff --git a/packages/devextreme-angular/src/ui/data-grid/nested/editing-texts.ts b/packages/devextreme-angular/src/ui/data-grid/nested/data-grid-editing-texts.ts similarity index 90% rename from packages/devextreme-angular/src/ui/data-grid/nested/editing-texts.ts rename to packages/devextreme-angular/src/ui/data-grid/nested/data-grid-editing-texts.ts index f4b66e898a82..b1b74a0d83a6 100644 --- a/packages/devextreme-angular/src/ui/data-grid/nested/editing-texts.ts +++ b/packages/devextreme-angular/src/ui/data-grid/nested/data-grid-editing-texts.ts @@ -23,13 +23,14 @@ import { NestedOption } from 'devextreme-angular/core'; @Component({ - selector: 'dxo-data-grid-editing-texts', + selector: 'dxo-data-grid-data-grid-editing-texts', + standalone: true, template: '', styles: [''], imports: [ DxIntegrationModule ], providers: [NestedOptionHost] }) -export class DxoDataGridEditingTextsComponent extends NestedOption implements OnDestroy, OnInit { +export class DxoDataGridDataGridEditingTextsComponent extends NestedOption implements OnDestroy, OnInit { @Input() get addRow(): string { return this._getOption('addRow'); @@ -145,10 +146,10 @@ export class DxoDataGridEditingTextsComponent extends NestedOption implements On @NgModule({ imports: [ - DxoDataGridEditingTextsComponent + DxoDataGridDataGridEditingTextsComponent ], exports: [ - DxoDataGridEditingTextsComponent + DxoDataGridDataGridEditingTextsComponent ], }) -export class DxoDataGridEditingTextsModule { } +export class DxoDataGridDataGridEditingTextsModule { } diff --git a/packages/devextreme-angular/src/ui/data-grid/nested/data-grid-editing.ts b/packages/devextreme-angular/src/ui/data-grid/nested/data-grid-editing.ts new file mode 100644 index 000000000000..45afe895602f --- /dev/null +++ b/packages/devextreme-angular/src/ui/data-grid/nested/data-grid-editing.ts @@ -0,0 +1,238 @@ +/* tslint:disable:max-line-length */ + + +import { + Component, + OnInit, + OnDestroy, + NgModule, + Host, + SkipSelf, + Input, + Output, + EventEmitter, + ContentChildren, + QueryList +} from '@angular/core'; + + + + +import type { default as dxDataGrid, dxDataGridRowObject } from 'devextreme/ui/data_grid'; +import type { DataChange, GridsEditMode, NewRowPosition, GridsEditRefreshMode, StartEditAction } from 'devextreme/common/grids'; +import type { dxFormOptions } from 'devextreme/ui/form'; +import type { dxPopupOptions } from 'devextreme/ui/popup'; + +import { + DxIntegrationModule, + NestedOptionHost, + CollectionNestedOption, +} from 'devextreme-angular/core'; +import { NestedOption } from 'devextreme-angular/core'; + +import { + PROPERTY_TOKEN_changes, +} from 'devextreme-angular/core/tokens'; + +@Component({ + selector: 'dxo-data-grid-data-grid-editing', + standalone: true, + template: '', + styles: [''], + imports: [ DxIntegrationModule ], + providers: [NestedOptionHost] +}) +export class DxoDataGridDataGridEditingComponent extends NestedOption implements OnDestroy, OnInit { + @ContentChildren(PROPERTY_TOKEN_changes) + set _changesContentChildren(value: QueryList) { + this.setChildren('changes', value); + } + + @Input() + get allowAdding(): boolean { + return this._getOption('allowAdding'); + } + set allowAdding(value: boolean) { + this._setOption('allowAdding', value); + } + + @Input() + get allowDeleting(): boolean | ((options: { component: dxDataGrid, row: dxDataGridRowObject }) => boolean) { + return this._getOption('allowDeleting'); + } + set allowDeleting(value: boolean | ((options: { component: dxDataGrid, row: dxDataGridRowObject }) => boolean)) { + this._setOption('allowDeleting', value); + } + + @Input() + get allowUpdating(): boolean | ((options: { component: dxDataGrid, row: dxDataGridRowObject }) => boolean) { + return this._getOption('allowUpdating'); + } + set allowUpdating(value: boolean | ((options: { component: dxDataGrid, row: dxDataGridRowObject }) => boolean)) { + this._setOption('allowUpdating', value); + } + + @Input() + get changes(): Array { + return this._getOption('changes'); + } + set changes(value: Array) { + this._setOption('changes', value); + } + + @Input() + get confirmDelete(): boolean { + return this._getOption('confirmDelete'); + } + set confirmDelete(value: boolean) { + this._setOption('confirmDelete', value); + } + + @Input() + get editColumnName(): string { + return this._getOption('editColumnName'); + } + set editColumnName(value: string) { + this._setOption('editColumnName', value); + } + + @Input() + get editRowKey(): any { + return this._getOption('editRowKey'); + } + set editRowKey(value: any) { + this._setOption('editRowKey', value); + } + + @Input() + get form(): dxFormOptions { + return this._getOption('form'); + } + set form(value: dxFormOptions) { + this._setOption('form', value); + } + + @Input() + get mode(): GridsEditMode { + return this._getOption('mode'); + } + set mode(value: GridsEditMode) { + this._setOption('mode', value); + } + + @Input() + get newRowPosition(): NewRowPosition { + return this._getOption('newRowPosition'); + } + set newRowPosition(value: NewRowPosition) { + this._setOption('newRowPosition', value); + } + + @Input() + get popup(): dxPopupOptions { + return this._getOption('popup'); + } + set popup(value: dxPopupOptions) { + this._setOption('popup', value); + } + + @Input() + get refreshMode(): GridsEditRefreshMode { + return this._getOption('refreshMode'); + } + set refreshMode(value: GridsEditRefreshMode) { + this._setOption('refreshMode', value); + } + + @Input() + get selectTextOnEditStart(): boolean { + return this._getOption('selectTextOnEditStart'); + } + set selectTextOnEditStart(value: boolean) { + this._setOption('selectTextOnEditStart', value); + } + + @Input() + get startEditAction(): StartEditAction { + return this._getOption('startEditAction'); + } + set startEditAction(value: StartEditAction) { + this._setOption('startEditAction', value); + } + + @Input() + get texts(): any | { addRow?: string, cancelAllChanges?: string, cancelRowChanges?: string, confirmDeleteMessage?: string, confirmDeleteTitle?: string, deleteRow?: string, editRow?: string, saveAllChanges?: string, saveRowChanges?: string, undeleteRow?: string, validationCancelChanges?: string } { + return this._getOption('texts'); + } + set texts(value: any | { addRow?: string, cancelAllChanges?: string, cancelRowChanges?: string, confirmDeleteMessage?: string, confirmDeleteTitle?: string, deleteRow?: string, editRow?: string, saveAllChanges?: string, saveRowChanges?: string, undeleteRow?: string, validationCancelChanges?: string }) { + this._setOption('texts', value); + } + + @Input() + get useIcons(): boolean { + return this._getOption('useIcons'); + } + set useIcons(value: boolean) { + this._setOption('useIcons', value); + } + + + /** + + * This member supports the internal infrastructure and is not intended to be used directly from your code. + + */ + @Output() changesChange: EventEmitter>; + + /** + + * This member supports the internal infrastructure and is not intended to be used directly from your code. + + */ + @Output() editColumnNameChange: EventEmitter; + + /** + + * This member supports the internal infrastructure and is not intended to be used directly from your code. + + */ + @Output() editRowKeyChange: EventEmitter; + protected get _optionPath() { + return 'editing'; + } + + + constructor(@SkipSelf() @Host() parentOptionHost: NestedOptionHost, + @Host() optionHost: NestedOptionHost) { + super(); + this._createEventEmitters([ + { emit: 'changesChange' }, + { emit: 'editColumnNameChange' }, + { emit: 'editRowKeyChange' } + ]); + + parentOptionHost.setNestedOption(this); + optionHost.setHost(this, this._fullOptionPath.bind(this)); + } + + + ngOnInit() { + this._addRecreatedComponent(); + } + + ngOnDestroy() { + this._addRemovedOption(this._getOptionPath()); + } + + +} + +@NgModule({ + imports: [ + DxoDataGridDataGridEditingComponent + ], + exports: [ + DxoDataGridDataGridEditingComponent + ], +}) +export class DxoDataGridDataGridEditingModule { } diff --git a/packages/devextreme-angular/src/ui/data-grid/nested/day-header-format.ts b/packages/devextreme-angular/src/ui/data-grid/nested/day-header-format.ts new file mode 100644 index 000000000000..0643c0df940e --- /dev/null +++ b/packages/devextreme-angular/src/ui/data-grid/nested/day-header-format.ts @@ -0,0 +1,116 @@ +/* tslint:disable:max-line-length */ + + +import { + Component, + OnInit, + OnDestroy, + NgModule, + Host, + SkipSelf, + Input +} from '@angular/core'; + + + + +import type { Format } from 'devextreme/common'; + +import { + DxIntegrationModule, + NestedOptionHost, +} from 'devextreme-angular/core'; +import { NestedOption } from 'devextreme-angular/core'; + + +@Component({ + selector: 'dxo-data-grid-day-header-format', + standalone: true, + template: '', + styles: [''], + imports: [ DxIntegrationModule ], + providers: [NestedOptionHost] +}) +export class DxoDataGridDayHeaderFormatComponent extends NestedOption implements OnDestroy, OnInit { + @Input() + get currency(): string { + return this._getOption('currency'); + } + set currency(value: string) { + this._setOption('currency', value); + } + + @Input() + get formatter(): ((value: number | Date) => string) { + return this._getOption('formatter'); + } + set formatter(value: ((value: number | Date) => string)) { + this._setOption('formatter', value); + } + + @Input() + get parser(): ((value: string) => number | Date) { + return this._getOption('parser'); + } + set parser(value: ((value: string) => number | Date)) { + this._setOption('parser', value); + } + + @Input() + get precision(): number { + return this._getOption('precision'); + } + set precision(value: number) { + this._setOption('precision', value); + } + + @Input() + get type(): Format | string { + return this._getOption('type'); + } + set type(value: Format | string) { + this._setOption('type', value); + } + + @Input() + get useCurrencyAccountingStyle(): boolean { + return this._getOption('useCurrencyAccountingStyle'); + } + set useCurrencyAccountingStyle(value: boolean) { + this._setOption('useCurrencyAccountingStyle', value); + } + + + protected get _optionPath() { + return 'dayHeaderFormat'; + } + + + constructor(@SkipSelf() @Host() parentOptionHost: NestedOptionHost, + @Host() optionHost: NestedOptionHost) { + super(); + parentOptionHost.setNestedOption(this); + optionHost.setHost(this, this._fullOptionPath.bind(this)); + } + + + ngOnInit() { + this._addRecreatedComponent(); + } + + ngOnDestroy() { + this._addRemovedOption(this._getOptionPath()); + } + + +} + +@NgModule({ + imports: [ + DxoDataGridDayHeaderFormatComponent + ], + exports: [ + DxoDataGridDayHeaderFormatComponent + ], +}) +export class DxoDataGridDayHeaderFormatModule { } diff --git a/packages/devextreme-angular/src/ui/data-grid/nested/file-uploader-options.ts b/packages/devextreme-angular/src/ui/data-grid/nested/file-uploader-options.ts new file mode 100644 index 000000000000..7cf03b45598c --- /dev/null +++ b/packages/devextreme-angular/src/ui/data-grid/nested/file-uploader-options.ts @@ -0,0 +1,594 @@ +/* tslint:disable:max-line-length */ + + +import { + Component, + OnInit, + OnDestroy, + NgModule, + Host, + SkipSelf, + Input, + Output, + EventEmitter +} from '@angular/core'; + + + + +import type UploadInfo from 'devextreme/file_management/upload_info'; +import type { BeforeSendEvent, ContentReadyEvent, DisposingEvent, DropZoneEnterEvent, DropZoneLeaveEvent, FilesUploadedEvent, InitializedEvent, OptionChangedEvent, ProgressEvent, UploadAbortedEvent, UploadedEvent, UploadErrorEvent, UploadStartedEvent, ValueChangedEvent, UploadHttpMethod, FileUploadMode } from 'devextreme/ui/file_uploader'; +import type { ValidationStatus } from 'devextreme/common'; + +import { + DxIntegrationModule, + NestedOptionHost, +} from 'devextreme-angular/core'; +import { NestedOption } from 'devextreme-angular/core'; + + +@Component({ + selector: 'dxo-data-grid-file-uploader-options', + standalone: true, + template: '', + styles: [''], + imports: [ DxIntegrationModule ], + providers: [NestedOptionHost] +}) +export class DxoDataGridFileUploaderOptionsComponent extends NestedOption implements OnDestroy, OnInit { + @Input() + get abortUpload(): ((file: any, uploadInfo?: UploadInfo) => any) { + return this._getOption('abortUpload'); + } + set abortUpload(value: ((file: any, uploadInfo?: UploadInfo) => any)) { + this._setOption('abortUpload', value); + } + + @Input() + get accept(): string { + return this._getOption('accept'); + } + set accept(value: string) { + this._setOption('accept', value); + } + + @Input() + get accessKey(): string | undefined { + return this._getOption('accessKey'); + } + set accessKey(value: string | undefined) { + this._setOption('accessKey', value); + } + + @Input() + get activeStateEnabled(): boolean { + return this._getOption('activeStateEnabled'); + } + set activeStateEnabled(value: boolean) { + this._setOption('activeStateEnabled', value); + } + + @Input() + get allowCanceling(): boolean { + return this._getOption('allowCanceling'); + } + set allowCanceling(value: boolean) { + this._setOption('allowCanceling', value); + } + + @Input() + get allowedFileExtensions(): Array { + return this._getOption('allowedFileExtensions'); + } + set allowedFileExtensions(value: Array) { + this._setOption('allowedFileExtensions', value); + } + + @Input() + get chunkSize(): number { + return this._getOption('chunkSize'); + } + set chunkSize(value: number) { + this._setOption('chunkSize', value); + } + + @Input() + get dialogTrigger(): any | string | undefined { + return this._getOption('dialogTrigger'); + } + set dialogTrigger(value: any | string | undefined) { + this._setOption('dialogTrigger', value); + } + + @Input() + get disabled(): boolean { + return this._getOption('disabled'); + } + set disabled(value: boolean) { + this._setOption('disabled', value); + } + + @Input() + get dropZone(): any | string | undefined { + return this._getOption('dropZone'); + } + set dropZone(value: any | string | undefined) { + this._setOption('dropZone', value); + } + + @Input() + get elementAttr(): Record { + return this._getOption('elementAttr'); + } + set elementAttr(value: Record) { + this._setOption('elementAttr', value); + } + + @Input() + get focusStateEnabled(): boolean { + return this._getOption('focusStateEnabled'); + } + set focusStateEnabled(value: boolean) { + this._setOption('focusStateEnabled', value); + } + + @Input() + get height(): number | string | undefined { + return this._getOption('height'); + } + set height(value: number | string | undefined) { + this._setOption('height', value); + } + + @Input() + get hint(): string | undefined { + return this._getOption('hint'); + } + set hint(value: string | undefined) { + this._setOption('hint', value); + } + + @Input() + get hoverStateEnabled(): boolean { + return this._getOption('hoverStateEnabled'); + } + set hoverStateEnabled(value: boolean) { + this._setOption('hoverStateEnabled', value); + } + + @Input() + get inputAttr(): any { + return this._getOption('inputAttr'); + } + set inputAttr(value: any) { + this._setOption('inputAttr', value); + } + + @Input() + get invalidFileExtensionMessage(): string { + return this._getOption('invalidFileExtensionMessage'); + } + set invalidFileExtensionMessage(value: string) { + this._setOption('invalidFileExtensionMessage', value); + } + + @Input() + get invalidMaxFileSizeMessage(): string { + return this._getOption('invalidMaxFileSizeMessage'); + } + set invalidMaxFileSizeMessage(value: string) { + this._setOption('invalidMaxFileSizeMessage', value); + } + + @Input() + get invalidMinFileSizeMessage(): string { + return this._getOption('invalidMinFileSizeMessage'); + } + set invalidMinFileSizeMessage(value: string) { + this._setOption('invalidMinFileSizeMessage', value); + } + + @Input() + get isDirty(): boolean { + return this._getOption('isDirty'); + } + set isDirty(value: boolean) { + this._setOption('isDirty', value); + } + + @Input() + get isValid(): boolean { + return this._getOption('isValid'); + } + set isValid(value: boolean) { + this._setOption('isValid', value); + } + + @Input() + get labelText(): string { + return this._getOption('labelText'); + } + set labelText(value: string) { + this._setOption('labelText', value); + } + + @Input() + get maxFileSize(): number { + return this._getOption('maxFileSize'); + } + set maxFileSize(value: number) { + this._setOption('maxFileSize', value); + } + + @Input() + get minFileSize(): number { + return this._getOption('minFileSize'); + } + set minFileSize(value: number) { + this._setOption('minFileSize', value); + } + + @Input() + get multiple(): boolean { + return this._getOption('multiple'); + } + set multiple(value: boolean) { + this._setOption('multiple', value); + } + + @Input() + get name(): string { + return this._getOption('name'); + } + set name(value: string) { + this._setOption('name', value); + } + + @Input() + get onBeforeSend(): ((e: BeforeSendEvent) => void) { + return this._getOption('onBeforeSend'); + } + set onBeforeSend(value: ((e: BeforeSendEvent) => void)) { + this._setOption('onBeforeSend', value); + } + + @Input() + get onContentReady(): ((e: ContentReadyEvent) => void) { + return this._getOption('onContentReady'); + } + set onContentReady(value: ((e: ContentReadyEvent) => void)) { + this._setOption('onContentReady', value); + } + + @Input() + get onDisposing(): ((e: DisposingEvent) => void) { + return this._getOption('onDisposing'); + } + set onDisposing(value: ((e: DisposingEvent) => void)) { + this._setOption('onDisposing', value); + } + + @Input() + get onDropZoneEnter(): ((e: DropZoneEnterEvent) => void) { + return this._getOption('onDropZoneEnter'); + } + set onDropZoneEnter(value: ((e: DropZoneEnterEvent) => void)) { + this._setOption('onDropZoneEnter', value); + } + + @Input() + get onDropZoneLeave(): ((e: DropZoneLeaveEvent) => void) { + return this._getOption('onDropZoneLeave'); + } + set onDropZoneLeave(value: ((e: DropZoneLeaveEvent) => void)) { + this._setOption('onDropZoneLeave', value); + } + + @Input() + get onFilesUploaded(): ((e: FilesUploadedEvent) => void) { + return this._getOption('onFilesUploaded'); + } + set onFilesUploaded(value: ((e: FilesUploadedEvent) => void)) { + this._setOption('onFilesUploaded', value); + } + + @Input() + get onInitialized(): ((e: InitializedEvent) => void) { + return this._getOption('onInitialized'); + } + set onInitialized(value: ((e: InitializedEvent) => void)) { + this._setOption('onInitialized', value); + } + + @Input() + get onOptionChanged(): ((e: OptionChangedEvent) => void) { + return this._getOption('onOptionChanged'); + } + set onOptionChanged(value: ((e: OptionChangedEvent) => void)) { + this._setOption('onOptionChanged', value); + } + + @Input() + get onProgress(): ((e: ProgressEvent) => void) { + return this._getOption('onProgress'); + } + set onProgress(value: ((e: ProgressEvent) => void)) { + this._setOption('onProgress', value); + } + + @Input() + get onUploadAborted(): ((e: UploadAbortedEvent) => void) { + return this._getOption('onUploadAborted'); + } + set onUploadAborted(value: ((e: UploadAbortedEvent) => void)) { + this._setOption('onUploadAborted', value); + } + + @Input() + get onUploaded(): ((e: UploadedEvent) => void) { + return this._getOption('onUploaded'); + } + set onUploaded(value: ((e: UploadedEvent) => void)) { + this._setOption('onUploaded', value); + } + + @Input() + get onUploadError(): ((e: UploadErrorEvent) => void) { + return this._getOption('onUploadError'); + } + set onUploadError(value: ((e: UploadErrorEvent) => void)) { + this._setOption('onUploadError', value); + } + + @Input() + get onUploadStarted(): ((e: UploadStartedEvent) => void) { + return this._getOption('onUploadStarted'); + } + set onUploadStarted(value: ((e: UploadStartedEvent) => void)) { + this._setOption('onUploadStarted', value); + } + + @Input() + get onValueChanged(): ((e: ValueChangedEvent) => void) { + return this._getOption('onValueChanged'); + } + set onValueChanged(value: ((e: ValueChangedEvent) => void)) { + this._setOption('onValueChanged', value); + } + + @Input() + get progress(): number { + return this._getOption('progress'); + } + set progress(value: number) { + this._setOption('progress', value); + } + + @Input() + get readOnly(): boolean { + return this._getOption('readOnly'); + } + set readOnly(value: boolean) { + this._setOption('readOnly', value); + } + + @Input() + get readyToUploadMessage(): string { + return this._getOption('readyToUploadMessage'); + } + set readyToUploadMessage(value: string) { + this._setOption('readyToUploadMessage', value); + } + + @Input() + get rtlEnabled(): boolean { + return this._getOption('rtlEnabled'); + } + set rtlEnabled(value: boolean) { + this._setOption('rtlEnabled', value); + } + + @Input() + get selectButtonText(): string { + return this._getOption('selectButtonText'); + } + set selectButtonText(value: string) { + this._setOption('selectButtonText', value); + } + + @Input() + get showFileList(): boolean { + return this._getOption('showFileList'); + } + set showFileList(value: boolean) { + this._setOption('showFileList', value); + } + + @Input() + get tabIndex(): number { + return this._getOption('tabIndex'); + } + set tabIndex(value: number) { + this._setOption('tabIndex', value); + } + + @Input() + get uploadAbortedMessage(): string { + return this._getOption('uploadAbortedMessage'); + } + set uploadAbortedMessage(value: string) { + this._setOption('uploadAbortedMessage', value); + } + + @Input() + get uploadButtonText(): string { + return this._getOption('uploadButtonText'); + } + set uploadButtonText(value: string) { + this._setOption('uploadButtonText', value); + } + + @Input() + get uploadChunk(): ((file: any, uploadInfo: UploadInfo) => any) { + return this._getOption('uploadChunk'); + } + set uploadChunk(value: ((file: any, uploadInfo: UploadInfo) => any)) { + this._setOption('uploadChunk', value); + } + + @Input() + get uploadCustomData(): any { + return this._getOption('uploadCustomData'); + } + set uploadCustomData(value: any) { + this._setOption('uploadCustomData', value); + } + + @Input() + get uploadedMessage(): string { + return this._getOption('uploadedMessage'); + } + set uploadedMessage(value: string) { + this._setOption('uploadedMessage', value); + } + + @Input() + get uploadFailedMessage(): string { + return this._getOption('uploadFailedMessage'); + } + set uploadFailedMessage(value: string) { + this._setOption('uploadFailedMessage', value); + } + + @Input() + get uploadFile(): ((file: any, progressCallback: Function) => any) { + return this._getOption('uploadFile'); + } + set uploadFile(value: ((file: any, progressCallback: Function) => any)) { + this._setOption('uploadFile', value); + } + + @Input() + get uploadHeaders(): any { + return this._getOption('uploadHeaders'); + } + set uploadHeaders(value: any) { + this._setOption('uploadHeaders', value); + } + + @Input() + get uploadMethod(): UploadHttpMethod { + return this._getOption('uploadMethod'); + } + set uploadMethod(value: UploadHttpMethod) { + this._setOption('uploadMethod', value); + } + + @Input() + get uploadMode(): FileUploadMode { + return this._getOption('uploadMode'); + } + set uploadMode(value: FileUploadMode) { + this._setOption('uploadMode', value); + } + + @Input() + get uploadUrl(): string { + return this._getOption('uploadUrl'); + } + set uploadUrl(value: string) { + this._setOption('uploadUrl', value); + } + + @Input() + get validationError(): any { + return this._getOption('validationError'); + } + set validationError(value: any) { + this._setOption('validationError', value); + } + + @Input() + get validationErrors(): Array { + return this._getOption('validationErrors'); + } + set validationErrors(value: Array) { + this._setOption('validationErrors', value); + } + + @Input() + get validationStatus(): ValidationStatus { + return this._getOption('validationStatus'); + } + set validationStatus(value: ValidationStatus) { + this._setOption('validationStatus', value); + } + + @Input() + get value(): Array { + return this._getOption('value'); + } + set value(value: Array) { + this._setOption('value', value); + } + + @Input() + get visible(): boolean { + return this._getOption('visible'); + } + set visible(value: boolean) { + this._setOption('visible', value); + } + + @Input() + get width(): number | string | undefined { + return this._getOption('width'); + } + set width(value: number | string | undefined) { + this._setOption('width', value); + } + + + /** + + * This member supports the internal infrastructure and is not intended to be used directly from your code. + + */ + @Output() valueChange: EventEmitter>; + protected get _optionPath() { + return 'fileUploaderOptions'; + } + + + constructor(@SkipSelf() @Host() parentOptionHost: NestedOptionHost, + @Host() optionHost: NestedOptionHost) { + super(); + this._createEventEmitters([ + { emit: 'valueChange' } + ]); + + parentOptionHost.setNestedOption(this); + optionHost.setHost(this, this._fullOptionPath.bind(this)); + } + + + ngOnInit() { + this._addRecreatedComponent(); + } + + ngOnDestroy() { + this._addRemovedOption(this._getOptionPath()); + } + + +} + +@NgModule({ + imports: [ + DxoDataGridFileUploaderOptionsComponent + ], + exports: [ + DxoDataGridFileUploaderOptionsComponent + ], +}) +export class DxoDataGridFileUploaderOptionsModule { } diff --git a/packages/devextreme-angular/src/ui/data-grid/nested/index.ts b/packages/devextreme-angular/src/ui/data-grid/nested/index.ts index 9458b527cc5e..48e9dce68371 100644 --- a/packages/devextreme-angular/src/ui/data-grid/nested/index.ts +++ b/packages/devextreme-angular/src/ui/data-grid/nested/index.ts @@ -1,13 +1,20 @@ +export * from './ai-assistant'; export * from './ai-options'; export * from './ai'; +export * from './alert-dxi'; export * from './animation'; export * from './async-rule-dxi'; export * from './at'; +export * from './attachment-dxi'; +export * from './author'; export * from './boundary-offset'; export * from './button-dxi'; export * from './button-item-dxi'; export * from './button-options'; export * from './change-dxi'; +export * from './chat-editing'; +export * from './chat-item-dxi'; +export * from './chat'; export * from './col-count-by-screen'; export * from './collision'; export * from './column-button-dxi'; @@ -24,12 +31,15 @@ export * from './compare-rule-dxi'; export * from './cursor-offset'; export * from './custom-operation-dxi'; export * from './custom-rule-dxi'; +export * from './custom-speech-recognizer'; +export * from './data-grid-editing-texts'; +export * from './data-grid-editing'; export * from './data-grid-header-filter-search'; export * from './data-grid-header-filter-texts'; export * from './data-grid-header-filter'; export * from './data-grid-selection'; export * from './data-grid-toolbar-item-dxi'; -export * from './editing-texts'; +export * from './day-header-format'; export * from './editing'; export * from './editor-options-button-dxi'; export * from './editor-options'; @@ -39,6 +49,7 @@ export * from './export-texts'; export * from './export'; export * from './field-dxi'; export * from './field-lookup'; +export * from './file-uploader-options'; export * from './filter-builder-popup'; export * from './filter-builder'; export * from './filter-operation-descriptions'; @@ -65,6 +76,7 @@ export * from './label'; export * from './load-panel'; export * from './lookup'; export * from './master-detail'; +export * from './message-timestamp-format'; export * from './my'; export * from './numeric-rule-dxi'; export * from './offset'; @@ -83,10 +95,13 @@ export * from './scrolling'; export * from './search-panel'; export * from './search'; export * from './selection'; +export * from './send-button-options'; export * from './show'; export * from './simple-item-dxi'; export * from './sort-by-group-summary-info-dxi'; export * from './sorting'; +export * from './speech-recognition-config'; +export * from './speech-to-text-options'; export * from './state-storing'; export * from './string-length-rule-dxi'; export * from './summary-texts'; @@ -100,6 +115,8 @@ export * from './to'; export * from './toolbar-item-dxi'; export * from './toolbar'; export * from './total-item-dxi'; +export * from './typing-user-dxi'; +export * from './user'; export * from './validation-rule-dxi'; export * from './value-format'; diff --git a/packages/devextreme-angular/src/ui/data-grid/nested/item-dxi.ts b/packages/devextreme-angular/src/ui/data-grid/nested/item-dxi.ts index c57c113a18df..6b09ef5f72e5 100644 --- a/packages/devextreme-angular/src/ui/data-grid/nested/item-dxi.ts +++ b/packages/devextreme-angular/src/ui/data-grid/nested/item-dxi.ts @@ -25,6 +25,7 @@ import type { DataGridPredefinedToolbarItem } from 'devextreme/ui/data_grid'; import type { dxTabPanelOptions } from 'devextreme/ui/tab_panel'; import type { dxButtonOptions } from 'devextreme/ui/button'; import type { LocateInMenuMode, ShowTextMode } from 'devextreme/ui/toolbar'; +import type { Attachment, User } from 'devextreme/ui/chat'; import { DxIntegrationModule, @@ -38,6 +39,7 @@ import { CollectionNestedOption } from 'devextreme-angular/core'; import { PROPERTY_TOKEN_validationRules, + PROPERTY_TOKEN_attachments, PROPERTY_TOKEN_tabs, PROPERTY_TOKEN_items, } from 'devextreme-angular/core/tokens'; @@ -63,6 +65,11 @@ export class DxiDataGridItemComponent extends CollectionNestedOption implements this.setChildren('validationRules', value); } + @ContentChildren(PROPERTY_TOKEN_attachments) + set _attachmentsContentChildren(value: QueryList) { + this.setChildren('attachments', value); + } + @ContentChildren(PROPERTY_TOKEN_tabs) set _tabsContentChildren(value: QueryList) { this.setChildren('tabs', value); @@ -385,6 +392,78 @@ export class DxiDataGridItemComponent extends CollectionNestedOption implements this._setOption('widget', value); } + @Input() + get alt(): string { + return this._getOption('alt'); + } + set alt(value: string) { + this._setOption('alt', value); + } + + @Input() + get attachments(): Array { + return this._getOption('attachments'); + } + set attachments(value: Array) { + this._setOption('attachments', value); + } + + @Input() + get author(): User { + return this._getOption('author'); + } + set author(value: User) { + this._setOption('author', value); + } + + @Input() + get id(): number | string { + return this._getOption('id'); + } + set id(value: number | string) { + this._setOption('id', value); + } + + @Input() + get isDeleted(): boolean { + return this._getOption('isDeleted'); + } + set isDeleted(value: boolean) { + this._setOption('isDeleted', value); + } + + @Input() + get isEdited(): boolean { + return this._getOption('isEdited'); + } + set isEdited(value: boolean) { + this._setOption('isEdited', value); + } + + @Input() + get src(): string { + return this._getOption('src'); + } + set src(value: string) { + this._setOption('src', value); + } + + @Input() + get timestamp(): Date | number | string { + return this._getOption('timestamp'); + } + set timestamp(value: Date | number | string) { + this._setOption('timestamp', value); + } + + @Input() + get type(): string | undefined { + return this._getOption('type'); + } + set type(value: string | undefined) { + this._setOption('type', value); + } + protected get _optionPath() { return 'items'; diff --git a/packages/devextreme-angular/src/ui/data-grid/nested/message-timestamp-format.ts b/packages/devextreme-angular/src/ui/data-grid/nested/message-timestamp-format.ts new file mode 100644 index 000000000000..c0d8bb5d3e3c --- /dev/null +++ b/packages/devextreme-angular/src/ui/data-grid/nested/message-timestamp-format.ts @@ -0,0 +1,116 @@ +/* tslint:disable:max-line-length */ + + +import { + Component, + OnInit, + OnDestroy, + NgModule, + Host, + SkipSelf, + Input +} from '@angular/core'; + + + + +import type { Format } from 'devextreme/common'; + +import { + DxIntegrationModule, + NestedOptionHost, +} from 'devextreme-angular/core'; +import { NestedOption } from 'devextreme-angular/core'; + + +@Component({ + selector: 'dxo-data-grid-message-timestamp-format', + standalone: true, + template: '', + styles: [''], + imports: [ DxIntegrationModule ], + providers: [NestedOptionHost] +}) +export class DxoDataGridMessageTimestampFormatComponent extends NestedOption implements OnDestroy, OnInit { + @Input() + get currency(): string { + return this._getOption('currency'); + } + set currency(value: string) { + this._setOption('currency', value); + } + + @Input() + get formatter(): ((value: number | Date) => string) { + return this._getOption('formatter'); + } + set formatter(value: ((value: number | Date) => string)) { + this._setOption('formatter', value); + } + + @Input() + get parser(): ((value: string) => number | Date) { + return this._getOption('parser'); + } + set parser(value: ((value: string) => number | Date)) { + this._setOption('parser', value); + } + + @Input() + get precision(): number { + return this._getOption('precision'); + } + set precision(value: number) { + this._setOption('precision', value); + } + + @Input() + get type(): Format | string { + return this._getOption('type'); + } + set type(value: Format | string) { + this._setOption('type', value); + } + + @Input() + get useCurrencyAccountingStyle(): boolean { + return this._getOption('useCurrencyAccountingStyle'); + } + set useCurrencyAccountingStyle(value: boolean) { + this._setOption('useCurrencyAccountingStyle', value); + } + + + protected get _optionPath() { + return 'messageTimestampFormat'; + } + + + constructor(@SkipSelf() @Host() parentOptionHost: NestedOptionHost, + @Host() optionHost: NestedOptionHost) { + super(); + parentOptionHost.setNestedOption(this); + optionHost.setHost(this, this._fullOptionPath.bind(this)); + } + + + ngOnInit() { + this._addRecreatedComponent(); + } + + ngOnDestroy() { + this._addRemovedOption(this._getOptionPath()); + } + + +} + +@NgModule({ + imports: [ + DxoDataGridMessageTimestampFormatComponent + ], + exports: [ + DxoDataGridMessageTimestampFormatComponent + ], +}) +export class DxoDataGridMessageTimestampFormatModule { } diff --git a/packages/devextreme-angular/src/ui/data-grid/nested/send-button-options.ts b/packages/devextreme-angular/src/ui/data-grid/nested/send-button-options.ts new file mode 100644 index 000000000000..4b12ecbc2ca8 --- /dev/null +++ b/packages/devextreme-angular/src/ui/data-grid/nested/send-button-options.ts @@ -0,0 +1,92 @@ +/* tslint:disable:max-line-length */ + + +import { + Component, + OnInit, + OnDestroy, + NgModule, + Host, + SkipSelf, + Input +} from '@angular/core'; + + + + +import type { SendButtonAction, SendButtonClickEvent } from 'devextreme/ui/chat'; + +import { + DxIntegrationModule, + NestedOptionHost, +} from 'devextreme-angular/core'; +import { NestedOption } from 'devextreme-angular/core'; + + +@Component({ + selector: 'dxo-data-grid-send-button-options', + standalone: true, + template: '', + styles: [''], + imports: [ DxIntegrationModule ], + providers: [NestedOptionHost] +}) +export class DxoDataGridSendButtonOptionsComponent extends NestedOption implements OnDestroy, OnInit { + @Input() + get action(): SendButtonAction { + return this._getOption('action'); + } + set action(value: SendButtonAction) { + this._setOption('action', value); + } + + @Input() + get icon(): string { + return this._getOption('icon'); + } + set icon(value: string) { + this._setOption('icon', value); + } + + @Input() + get onClick(): ((e: SendButtonClickEvent) => void) { + return this._getOption('onClick'); + } + set onClick(value: ((e: SendButtonClickEvent) => void)) { + this._setOption('onClick', value); + } + + + protected get _optionPath() { + return 'sendButtonOptions'; + } + + + constructor(@SkipSelf() @Host() parentOptionHost: NestedOptionHost, + @Host() optionHost: NestedOptionHost) { + super(); + parentOptionHost.setNestedOption(this); + optionHost.setHost(this, this._fullOptionPath.bind(this)); + } + + + ngOnInit() { + this._addRecreatedComponent(); + } + + ngOnDestroy() { + this._addRemovedOption(this._getOptionPath()); + } + + +} + +@NgModule({ + imports: [ + DxoDataGridSendButtonOptionsComponent + ], + exports: [ + DxoDataGridSendButtonOptionsComponent + ], +}) +export class DxoDataGridSendButtonOptionsModule { } diff --git a/packages/devextreme-angular/src/ui/data-grid/nested/speech-recognition-config.ts b/packages/devextreme-angular/src/ui/data-grid/nested/speech-recognition-config.ts new file mode 100644 index 000000000000..4dfdb08c240b --- /dev/null +++ b/packages/devextreme-angular/src/ui/data-grid/nested/speech-recognition-config.ts @@ -0,0 +1,107 @@ +/* tslint:disable:max-line-length */ + + +import { + Component, + OnInit, + OnDestroy, + NgModule, + Host, + SkipSelf, + Input +} from '@angular/core'; + + + + + +import { + DxIntegrationModule, + NestedOptionHost, +} from 'devextreme-angular/core'; +import { NestedOption } from 'devextreme-angular/core'; + + +@Component({ + selector: 'dxo-data-grid-speech-recognition-config', + standalone: true, + template: '', + styles: [''], + imports: [ DxIntegrationModule ], + providers: [NestedOptionHost] +}) +export class DxoDataGridSpeechRecognitionConfigComponent extends NestedOption implements OnDestroy, OnInit { + @Input() + get continuous(): boolean { + return this._getOption('continuous'); + } + set continuous(value: boolean) { + this._setOption('continuous', value); + } + + @Input() + get grammars(): Array { + return this._getOption('grammars'); + } + set grammars(value: Array) { + this._setOption('grammars', value); + } + + @Input() + get interimResults(): boolean { + return this._getOption('interimResults'); + } + set interimResults(value: boolean) { + this._setOption('interimResults', value); + } + + @Input() + get lang(): string { + return this._getOption('lang'); + } + set lang(value: string) { + this._setOption('lang', value); + } + + @Input() + get maxAlternatives(): number { + return this._getOption('maxAlternatives'); + } + set maxAlternatives(value: number) { + this._setOption('maxAlternatives', value); + } + + + protected get _optionPath() { + return 'speechRecognitionConfig'; + } + + + constructor(@SkipSelf() @Host() parentOptionHost: NestedOptionHost, + @Host() optionHost: NestedOptionHost) { + super(); + parentOptionHost.setNestedOption(this); + optionHost.setHost(this, this._fullOptionPath.bind(this)); + } + + + ngOnInit() { + this._addRecreatedComponent(); + } + + ngOnDestroy() { + this._addRemovedOption(this._getOptionPath()); + } + + +} + +@NgModule({ + imports: [ + DxoDataGridSpeechRecognitionConfigComponent + ], + exports: [ + DxoDataGridSpeechRecognitionConfigComponent + ], +}) +export class DxoDataGridSpeechRecognitionConfigModule { } diff --git a/packages/devextreme-angular/src/ui/data-grid/nested/speech-to-text-options.ts b/packages/devextreme-angular/src/ui/data-grid/nested/speech-to-text-options.ts new file mode 100644 index 000000000000..399793aeb528 --- /dev/null +++ b/packages/devextreme-angular/src/ui/data-grid/nested/speech-to-text-options.ts @@ -0,0 +1,301 @@ +/* tslint:disable:max-line-length */ + + +import { + Component, + OnInit, + OnDestroy, + NgModule, + Host, + SkipSelf, + Input +} from '@angular/core'; + + + + +import type { CustomSpeechRecognizer, ContentReadyEvent, DisposingEvent, EndEvent, ErrorEvent, InitializedEvent, OptionChangedEvent, ResultEvent, StartClickEvent, StopClickEvent, SpeechRecognitionConfig } from 'devextreme/ui/speech_to_text'; +import type { ButtonStyle, ButtonType } from 'devextreme/common'; + +import { + DxIntegrationModule, + NestedOptionHost, +} from 'devextreme-angular/core'; +import { NestedOption } from 'devextreme-angular/core'; + + +@Component({ + selector: 'dxo-data-grid-speech-to-text-options', + standalone: true, + template: '', + styles: [''], + imports: [ DxIntegrationModule ], + providers: [NestedOptionHost] +}) +export class DxoDataGridSpeechToTextOptionsComponent extends NestedOption implements OnDestroy, OnInit { + @Input() + get accessKey(): string | undefined { + return this._getOption('accessKey'); + } + set accessKey(value: string | undefined) { + this._setOption('accessKey', value); + } + + @Input() + get activeStateEnabled(): boolean { + return this._getOption('activeStateEnabled'); + } + set activeStateEnabled(value: boolean) { + this._setOption('activeStateEnabled', value); + } + + @Input() + get customSpeechRecognizer(): CustomSpeechRecognizer { + return this._getOption('customSpeechRecognizer'); + } + set customSpeechRecognizer(value: CustomSpeechRecognizer) { + this._setOption('customSpeechRecognizer', value); + } + + @Input() + get disabled(): boolean { + return this._getOption('disabled'); + } + set disabled(value: boolean) { + this._setOption('disabled', value); + } + + @Input() + get elementAttr(): Record { + return this._getOption('elementAttr'); + } + set elementAttr(value: Record) { + this._setOption('elementAttr', value); + } + + @Input() + get focusStateEnabled(): boolean { + return this._getOption('focusStateEnabled'); + } + set focusStateEnabled(value: boolean) { + this._setOption('focusStateEnabled', value); + } + + @Input() + get height(): number | string | undefined { + return this._getOption('height'); + } + set height(value: number | string | undefined) { + this._setOption('height', value); + } + + @Input() + get hint(): string | undefined { + return this._getOption('hint'); + } + set hint(value: string | undefined) { + this._setOption('hint', value); + } + + @Input() + get hoverStateEnabled(): boolean { + return this._getOption('hoverStateEnabled'); + } + set hoverStateEnabled(value: boolean) { + this._setOption('hoverStateEnabled', value); + } + + @Input() + get onContentReady(): ((e: ContentReadyEvent) => void) { + return this._getOption('onContentReady'); + } + set onContentReady(value: ((e: ContentReadyEvent) => void)) { + this._setOption('onContentReady', value); + } + + @Input() + get onDisposing(): ((e: DisposingEvent) => void) { + return this._getOption('onDisposing'); + } + set onDisposing(value: ((e: DisposingEvent) => void)) { + this._setOption('onDisposing', value); + } + + @Input() + get onEnd(): ((e: EndEvent) => void) | undefined { + return this._getOption('onEnd'); + } + set onEnd(value: ((e: EndEvent) => void) | undefined) { + this._setOption('onEnd', value); + } + + @Input() + get onError(): ((e: ErrorEvent) => void) | undefined { + return this._getOption('onError'); + } + set onError(value: ((e: ErrorEvent) => void) | undefined) { + this._setOption('onError', value); + } + + @Input() + get onInitialized(): ((e: InitializedEvent) => void) { + return this._getOption('onInitialized'); + } + set onInitialized(value: ((e: InitializedEvent) => void)) { + this._setOption('onInitialized', value); + } + + @Input() + get onOptionChanged(): ((e: OptionChangedEvent) => void) { + return this._getOption('onOptionChanged'); + } + set onOptionChanged(value: ((e: OptionChangedEvent) => void)) { + this._setOption('onOptionChanged', value); + } + + @Input() + get onResult(): ((e: ResultEvent) => void) | undefined { + return this._getOption('onResult'); + } + set onResult(value: ((e: ResultEvent) => void) | undefined) { + this._setOption('onResult', value); + } + + @Input() + get onStartClick(): ((e: StartClickEvent) => void) | undefined { + return this._getOption('onStartClick'); + } + set onStartClick(value: ((e: StartClickEvent) => void) | undefined) { + this._setOption('onStartClick', value); + } + + @Input() + get onStopClick(): ((e: StopClickEvent) => void) | undefined { + return this._getOption('onStopClick'); + } + set onStopClick(value: ((e: StopClickEvent) => void) | undefined) { + this._setOption('onStopClick', value); + } + + @Input() + get rtlEnabled(): boolean { + return this._getOption('rtlEnabled'); + } + set rtlEnabled(value: boolean) { + this._setOption('rtlEnabled', value); + } + + @Input() + get speechRecognitionConfig(): Record | SpeechRecognitionConfig { + return this._getOption('speechRecognitionConfig'); + } + set speechRecognitionConfig(value: Record | SpeechRecognitionConfig) { + this._setOption('speechRecognitionConfig', value); + } + + @Input() + get startIcon(): string { + return this._getOption('startIcon'); + } + set startIcon(value: string) { + this._setOption('startIcon', value); + } + + @Input() + get startText(): string { + return this._getOption('startText'); + } + set startText(value: string) { + this._setOption('startText', value); + } + + @Input() + get stopIcon(): string { + return this._getOption('stopIcon'); + } + set stopIcon(value: string) { + this._setOption('stopIcon', value); + } + + @Input() + get stopText(): string { + return this._getOption('stopText'); + } + set stopText(value: string) { + this._setOption('stopText', value); + } + + @Input() + get stylingMode(): ButtonStyle { + return this._getOption('stylingMode'); + } + set stylingMode(value: ButtonStyle) { + this._setOption('stylingMode', value); + } + + @Input() + get tabIndex(): number { + return this._getOption('tabIndex'); + } + set tabIndex(value: number) { + this._setOption('tabIndex', value); + } + + @Input() + get type(): ButtonType | string { + return this._getOption('type'); + } + set type(value: ButtonType | string) { + this._setOption('type', value); + } + + @Input() + get visible(): boolean { + return this._getOption('visible'); + } + set visible(value: boolean) { + this._setOption('visible', value); + } + + @Input() + get width(): number | string | undefined { + return this._getOption('width'); + } + set width(value: number | string | undefined) { + this._setOption('width', value); + } + + + protected get _optionPath() { + return 'speechToTextOptions'; + } + + + constructor(@SkipSelf() @Host() parentOptionHost: NestedOptionHost, + @Host() optionHost: NestedOptionHost) { + super(); + parentOptionHost.setNestedOption(this); + optionHost.setHost(this, this._fullOptionPath.bind(this)); + } + + + ngOnInit() { + this._addRecreatedComponent(); + } + + ngOnDestroy() { + this._addRemovedOption(this._getOptionPath()); + } + + +} + +@NgModule({ + imports: [ + DxoDataGridSpeechToTextOptionsComponent + ], + exports: [ + DxoDataGridSpeechToTextOptionsComponent + ], +}) +export class DxoDataGridSpeechToTextOptionsModule { } diff --git a/packages/devextreme-angular/src/ui/data-grid/nested/typing-user-dxi.ts b/packages/devextreme-angular/src/ui/data-grid/nested/typing-user-dxi.ts new file mode 100644 index 000000000000..ad9b2b123f89 --- /dev/null +++ b/packages/devextreme-angular/src/ui/data-grid/nested/typing-user-dxi.ts @@ -0,0 +1,100 @@ +/* tslint:disable:max-line-length */ + + +import { + Component, + NgModule, + Host, + SkipSelf, + Input +} from '@angular/core'; + + + + + +import { + DxIntegrationModule, + NestedOptionHost, +} from 'devextreme-angular/core'; +import { CollectionNestedOption } from 'devextreme-angular/core'; + +import { PROPERTY_TOKEN_typingUsers } from 'devextreme-angular/core/tokens'; + +@Component({ + selector: 'dxi-data-grid-typing-user', + standalone: true, + template: '', + styles: [''], + imports: [ DxIntegrationModule ], + providers: [ + NestedOptionHost, + { + provide: PROPERTY_TOKEN_typingUsers, + useExisting: DxiDataGridTypingUserComponent, + } + ] +}) +export class DxiDataGridTypingUserComponent extends CollectionNestedOption { + @Input() + get avatarAlt(): string { + return this._getOption('avatarAlt'); + } + set avatarAlt(value: string) { + this._setOption('avatarAlt', value); + } + + @Input() + get avatarUrl(): string { + return this._getOption('avatarUrl'); + } + set avatarUrl(value: string) { + this._setOption('avatarUrl', value); + } + + @Input() + get id(): number | string { + return this._getOption('id'); + } + set id(value: number | string) { + this._setOption('id', value); + } + + @Input() + get name(): string { + return this._getOption('name'); + } + set name(value: string) { + this._setOption('name', value); + } + + + protected get _optionPath() { + return 'typingUsers'; + } + + + constructor(@SkipSelf() @Host() parentOptionHost: NestedOptionHost, + @Host() optionHost: NestedOptionHost) { + super(); + parentOptionHost.setNestedOption(this); + optionHost.setHost(this, this._fullOptionPath.bind(this)); + } + + + + ngOnDestroy() { + this._deleteRemovedOptions(this._fullOptionPath()); + } + +} + +@NgModule({ + imports: [ + DxiDataGridTypingUserComponent + ], + exports: [ + DxiDataGridTypingUserComponent + ], +}) +export class DxiDataGridTypingUserModule { } diff --git a/packages/devextreme-angular/src/ui/data-grid/nested/user.ts b/packages/devextreme-angular/src/ui/data-grid/nested/user.ts new file mode 100644 index 000000000000..cc76c1f1aeea --- /dev/null +++ b/packages/devextreme-angular/src/ui/data-grid/nested/user.ts @@ -0,0 +1,99 @@ +/* tslint:disable:max-line-length */ + + +import { + Component, + OnInit, + OnDestroy, + NgModule, + Host, + SkipSelf, + Input +} from '@angular/core'; + + + + + +import { + DxIntegrationModule, + NestedOptionHost, +} from 'devextreme-angular/core'; +import { NestedOption } from 'devextreme-angular/core'; + + +@Component({ + selector: 'dxo-data-grid-user', + standalone: true, + template: '', + styles: [''], + imports: [ DxIntegrationModule ], + providers: [NestedOptionHost] +}) +export class DxoDataGridUserComponent extends NestedOption implements OnDestroy, OnInit { + @Input() + get avatarAlt(): string { + return this._getOption('avatarAlt'); + } + set avatarAlt(value: string) { + this._setOption('avatarAlt', value); + } + + @Input() + get avatarUrl(): string { + return this._getOption('avatarUrl'); + } + set avatarUrl(value: string) { + this._setOption('avatarUrl', value); + } + + @Input() + get id(): number | string { + return this._getOption('id'); + } + set id(value: number | string) { + this._setOption('id', value); + } + + @Input() + get name(): string { + return this._getOption('name'); + } + set name(value: string) { + this._setOption('name', value); + } + + + protected get _optionPath() { + return 'user'; + } + + + constructor(@SkipSelf() @Host() parentOptionHost: NestedOptionHost, + @Host() optionHost: NestedOptionHost) { + super(); + parentOptionHost.setNestedOption(this); + optionHost.setHost(this, this._fullOptionPath.bind(this)); + } + + + ngOnInit() { + this._addRecreatedComponent(); + } + + ngOnDestroy() { + this._addRemovedOption(this._getOptionPath()); + } + + +} + +@NgModule({ + imports: [ + DxoDataGridUserComponent + ], + exports: [ + DxoDataGridUserComponent + ], +}) +export class DxoDataGridUserModule { } diff --git a/packages/devextreme-angular/src/ui/tree-list/index.ts b/packages/devextreme-angular/src/ui/tree-list/index.ts index 21b8807f5167..9bfc65944fa2 100644 --- a/packages/devextreme-angular/src/ui/tree-list/index.ts +++ b/packages/devextreme-angular/src/ui/tree-list/index.ts @@ -25,9 +25,9 @@ export type { ExplicitTypes } from 'devextreme/ui/tree_list'; import type dxSortable from 'devextreme/ui/sortable'; import type dxDraggable from 'devextreme/ui/draggable'; +import type { AIAssistant, ColumnChooser, ColumnResizeMode, DataChange, GridsEditMode, GridsEditRefreshMode, StartEditAction, FilterPanel, ApplyFilterMode, HeaderFilter, EnterKeyAction, EnterKeyDirection, Pager, GridBase, DataRenderMode, SearchPanel, Sorting, StateStoreType } from 'devextreme/common/grids'; import type { AIIntegration } from 'devextreme/common/ai-integration'; -import type { ColumnChooser, ColumnResizeMode, DataChange, GridsEditMode, GridsEditRefreshMode, StartEditAction, FilterPanel, ApplyFilterMode, HeaderFilter, EnterKeyAction, EnterKeyDirection, Pager, GridBase, DataRenderMode, SearchPanel, Sorting, StateStoreType } from 'devextreme/common/grids'; -import type { default as dxTreeList, dxTreeListColumn, dxTreeListRowObject, TreeListFilterMode, AdaptiveDetailRowPreparingEvent, AIColumnRequestCreatingEvent, CellClickEvent, CellDblClickEvent, CellHoverChangedEvent, CellPreparedEvent, ContentReadyEvent, ContextMenuPreparingEvent, DataErrorOccurredEvent, DisposingEvent, EditCanceledEvent, EditCancelingEvent, EditingStartEvent, EditorPreparedEvent, EditorPreparingEvent, FocusedCellChangedEvent, FocusedCellChangingEvent, FocusedRowChangedEvent, FocusedRowChangingEvent, InitializedEvent, InitNewRowEvent, KeyDownEvent, NodesInitializedEvent, OptionChangedEvent, RowClickEvent, RowCollapsedEvent, RowCollapsingEvent, RowDblClickEvent, RowExpandedEvent, RowExpandingEvent, RowInsertedEvent, RowInsertingEvent, RowPreparedEvent, RowRemovedEvent, RowRemovingEvent, RowUpdatedEvent, RowUpdatingEvent, RowValidatingEvent, SavedEvent, SavingEvent, SelectionChangedEvent, ToolbarPreparingEvent, dxTreeListToolbar } from 'devextreme/ui/tree_list'; +import type { default as dxTreeList, dxTreeListColumn, dxTreeListRowObject, TreeListFilterMode, AdaptiveDetailRowPreparingEvent, AIAssistantRequestCreatingEvent, AIColumnRequestCreatingEvent, CellClickEvent, CellDblClickEvent, CellHoverChangedEvent, CellPreparedEvent, ContentReadyEvent, ContextMenuPreparingEvent, DataErrorOccurredEvent, DisposingEvent, EditCanceledEvent, EditCancelingEvent, EditingStartEvent, EditorPreparedEvent, EditorPreparingEvent, FocusedCellChangedEvent, FocusedCellChangingEvent, FocusedRowChangedEvent, FocusedRowChangingEvent, InitializedEvent, InitNewRowEvent, KeyDownEvent, NodesInitializedEvent, OptionChangedEvent, RowClickEvent, RowCollapsedEvent, RowCollapsingEvent, RowDblClickEvent, RowExpandedEvent, RowExpandingEvent, RowInsertedEvent, RowInsertingEvent, RowPreparedEvent, RowRemovedEvent, RowRemovingEvent, RowUpdatedEvent, RowUpdatingEvent, RowValidatingEvent, SavedEvent, SavingEvent, SelectionChangedEvent, ToolbarPreparingEvent, dxTreeListToolbar } from 'devextreme/ui/tree_list'; import type { Mode, DataStructure, DragDirection, DragHighlight, ScrollMode, ScrollbarMode, SingleMultipleOrNone } from 'devextreme/common'; import type { default as DataSource, DataSourceOptions } from 'devextreme/data/data_source'; import type { Store } from 'devextreme/data/store'; @@ -108,15 +108,22 @@ import { DxoStateStoringModule } from 'devextreme-angular/ui/nested'; import { DxoToolbarModule } from 'devextreme-angular/ui/nested'; import { DxoTreeListAIModule } from 'devextreme-angular/ui/tree-list/nested'; +import { DxoTreeListAIAssistantModule } from 'devextreme-angular/ui/tree-list/nested'; import { DxoTreeListAIOptionsModule } from 'devextreme-angular/ui/tree-list/nested'; +import { DxiTreeListAlertModule } from 'devextreme-angular/ui/tree-list/nested'; import { DxoTreeListAnimationModule } from 'devextreme-angular/ui/tree-list/nested'; import { DxiTreeListAsyncRuleModule } from 'devextreme-angular/ui/tree-list/nested'; import { DxoTreeListAtModule } from 'devextreme-angular/ui/tree-list/nested'; +import { DxiTreeListAttachmentModule } from 'devextreme-angular/ui/tree-list/nested'; +import { DxoTreeListAuthorModule } from 'devextreme-angular/ui/tree-list/nested'; import { DxoTreeListBoundaryOffsetModule } from 'devextreme-angular/ui/tree-list/nested'; import { DxiTreeListButtonModule } from 'devextreme-angular/ui/tree-list/nested'; import { DxiTreeListButtonItemModule } from 'devextreme-angular/ui/tree-list/nested'; import { DxoTreeListButtonOptionsModule } from 'devextreme-angular/ui/tree-list/nested'; import { DxiTreeListChangeModule } from 'devextreme-angular/ui/tree-list/nested'; +import { DxoTreeListChatModule } from 'devextreme-angular/ui/tree-list/nested'; +import { DxoTreeListChatEditingModule } from 'devextreme-angular/ui/tree-list/nested'; +import { DxiTreeListChatItemModule } from 'devextreme-angular/ui/tree-list/nested'; import { DxoTreeListColCountByScreenModule } from 'devextreme-angular/ui/tree-list/nested'; import { DxoTreeListCollisionModule } from 'devextreme-angular/ui/tree-list/nested'; import { DxiTreeListColumnModule } from 'devextreme-angular/ui/tree-list/nested'; @@ -133,14 +140,16 @@ import { DxiTreeListCompareRuleModule } from 'devextreme-angular/ui/tree-list/ne import { DxoTreeListCursorOffsetModule } from 'devextreme-angular/ui/tree-list/nested'; import { DxiTreeListCustomOperationModule } from 'devextreme-angular/ui/tree-list/nested'; import { DxiTreeListCustomRuleModule } from 'devextreme-angular/ui/tree-list/nested'; +import { DxoTreeListCustomSpeechRecognizerModule } from 'devextreme-angular/ui/tree-list/nested'; +import { DxoTreeListDayHeaderFormatModule } from 'devextreme-angular/ui/tree-list/nested'; import { DxoTreeListEditingModule } from 'devextreme-angular/ui/tree-list/nested'; -import { DxoTreeListEditingTextsModule } from 'devextreme-angular/ui/tree-list/nested'; import { DxoTreeListEditorOptionsModule } from 'devextreme-angular/ui/tree-list/nested'; import { DxiTreeListEditorOptionsButtonModule } from 'devextreme-angular/ui/tree-list/nested'; import { DxiTreeListEmailRuleModule } from 'devextreme-angular/ui/tree-list/nested'; import { DxiTreeListEmptyItemModule } from 'devextreme-angular/ui/tree-list/nested'; import { DxiTreeListFieldModule } from 'devextreme-angular/ui/tree-list/nested'; import { DxoTreeListFieldLookupModule } from 'devextreme-angular/ui/tree-list/nested'; +import { DxoTreeListFileUploaderOptionsModule } from 'devextreme-angular/ui/tree-list/nested'; import { DxoTreeListFilterBuilderModule } from 'devextreme-angular/ui/tree-list/nested'; import { DxoTreeListFilterBuilderPopupModule } from 'devextreme-angular/ui/tree-list/nested'; import { DxoTreeListFilterOperationDescriptionsModule } from 'devextreme-angular/ui/tree-list/nested'; @@ -162,6 +171,7 @@ import { DxoTreeListKeyboardNavigationModule } from 'devextreme-angular/ui/tree- import { DxoTreeListLabelModule } from 'devextreme-angular/ui/tree-list/nested'; import { DxoTreeListLoadPanelModule } from 'devextreme-angular/ui/tree-list/nested'; import { DxoTreeListLookupModule } from 'devextreme-angular/ui/tree-list/nested'; +import { DxoTreeListMessageTimestampFormatModule } from 'devextreme-angular/ui/tree-list/nested'; import { DxoTreeListMyModule } from 'devextreme-angular/ui/tree-list/nested'; import { DxiTreeListNumericRuleModule } from 'devextreme-angular/ui/tree-list/nested'; import { DxoTreeListOffsetModule } from 'devextreme-angular/ui/tree-list/nested'; @@ -180,9 +190,12 @@ import { DxoTreeListScrollingModule } from 'devextreme-angular/ui/tree-list/nest import { DxoTreeListSearchModule } from 'devextreme-angular/ui/tree-list/nested'; import { DxoTreeListSearchPanelModule } from 'devextreme-angular/ui/tree-list/nested'; import { DxoTreeListSelectionModule } from 'devextreme-angular/ui/tree-list/nested'; +import { DxoTreeListSendButtonOptionsModule } from 'devextreme-angular/ui/tree-list/nested'; import { DxoTreeListShowModule } from 'devextreme-angular/ui/tree-list/nested'; import { DxiTreeListSimpleItemModule } from 'devextreme-angular/ui/tree-list/nested'; import { DxoTreeListSortingModule } from 'devextreme-angular/ui/tree-list/nested'; +import { DxoTreeListSpeechRecognitionConfigModule } from 'devextreme-angular/ui/tree-list/nested'; +import { DxoTreeListSpeechToTextOptionsModule } from 'devextreme-angular/ui/tree-list/nested'; import { DxoTreeListStateStoringModule } from 'devextreme-angular/ui/tree-list/nested'; import { DxiTreeListStringLengthRuleModule } from 'devextreme-angular/ui/tree-list/nested'; import { DxiTreeListTabModule } from 'devextreme-angular/ui/tree-list/nested'; @@ -193,14 +206,20 @@ import { DxoTreeListTextsModule } from 'devextreme-angular/ui/tree-list/nested'; import { DxoTreeListToModule } from 'devextreme-angular/ui/tree-list/nested'; import { DxoTreeListToolbarModule } from 'devextreme-angular/ui/tree-list/nested'; import { DxiTreeListToolbarItemModule } from 'devextreme-angular/ui/tree-list/nested'; +import { DxoTreeListTreeListEditingModule } from 'devextreme-angular/ui/tree-list/nested'; +import { DxoTreeListTreeListEditingTextsModule } from 'devextreme-angular/ui/tree-list/nested'; import { DxoTreeListTreeListHeaderFilterModule } from 'devextreme-angular/ui/tree-list/nested'; import { DxoTreeListTreeListHeaderFilterSearchModule } from 'devextreme-angular/ui/tree-list/nested'; import { DxoTreeListTreeListHeaderFilterTextsModule } from 'devextreme-angular/ui/tree-list/nested'; import { DxoTreeListTreeListSelectionModule } from 'devextreme-angular/ui/tree-list/nested'; import { DxiTreeListTreeListToolbarItemModule } from 'devextreme-angular/ui/tree-list/nested'; +import { DxiTreeListTypingUserModule } from 'devextreme-angular/ui/tree-list/nested'; +import { DxoTreeListUserModule } from 'devextreme-angular/ui/tree-list/nested'; import { DxiTreeListValidationRuleModule } from 'devextreme-angular/ui/tree-list/nested'; import { + PROPERTY_TOKEN_alerts, PROPERTY_TOKEN_validationRules, + PROPERTY_TOKEN_attachments, PROPERTY_TOKEN_buttons, PROPERTY_TOKEN_items, PROPERTY_TOKEN_changes, @@ -209,6 +228,7 @@ import { PROPERTY_TOKEN_fields, PROPERTY_TOKEN_tabs, PROPERTY_TOKEN_toolbarItems, + PROPERTY_TOKEN_typingUsers, } from 'devextreme-angular/core/tokens'; @@ -230,11 +250,21 @@ import { }) export class DxTreeListComponent extends DxComponent implements OnDestroy, OnChanges, DoCheck { + @ContentChildren(PROPERTY_TOKEN_alerts) + set _alertsContentChildren(value: QueryList) { + this.setChildren('alerts', value); + } + @ContentChildren(PROPERTY_TOKEN_validationRules) set _validationRulesContentChildren(value: QueryList) { this.setChildren('validationRules', value); } + @ContentChildren(PROPERTY_TOKEN_attachments) + set _attachmentsContentChildren(value: QueryList) { + this.setChildren('attachments', value); + } + @ContentChildren(PROPERTY_TOKEN_buttons) set _buttonsContentChildren(value: QueryList) { this.setChildren('buttons', value); @@ -275,6 +305,11 @@ export class DxTreeListComponent extends DxComponent this.setChildren('toolbarItems', value); } + @ContentChildren(PROPERTY_TOKEN_typingUsers) + set _typingUsersContentChildren(value: QueryList) { + this.setChildren('typingUsers', value); + } + instance: DxTreeList = null; /** @@ -303,6 +338,16 @@ export class DxTreeListComponent extends DxComponent } + + @Input() + get aiAssistant(): AIAssistant { + return this._getOption('aiAssistant'); + } + set aiAssistant(value: AIAssistant) { + this._setOption('aiAssistant', value); + } + + /** * [descr:GridBaseOptions.aiIntegration] @@ -1272,6 +1317,14 @@ export class DxTreeListComponent extends DxComponent */ @Output() onAdaptiveDetailRowPreparing: EventEmitter; + /** + + * [descr:dxTreeListOptions.onAIAssistantRequestCreating] + + + */ + @Output() onAIAssistantRequestCreating: EventEmitter; + /** * [descr:dxTreeListOptions.onAIColumnRequestCreating] @@ -1614,6 +1667,13 @@ export class DxTreeListComponent extends DxComponent */ @Output() activeStateEnabledChange: EventEmitter; + /** + + * This member supports the internal infrastructure and is not intended to be used directly from your code. + + */ + @Output() aiAssistantChange: EventEmitter; + /** * This member supports the internal infrastructure and is not intended to be used directly from your code. @@ -2146,6 +2206,7 @@ export class DxTreeListComponent extends DxComponent this._createEventEmitters([ { subscribe: 'adaptiveDetailRowPreparing', emit: 'onAdaptiveDetailRowPreparing' }, + { subscribe: 'aIAssistantRequestCreating', emit: 'onAIAssistantRequestCreating' }, { subscribe: 'aIColumnRequestCreating', emit: 'onAIColumnRequestCreating' }, { subscribe: 'cellClick', emit: 'onCellClick' }, { subscribe: 'cellDblClick', emit: 'onCellDblClick' }, @@ -2189,6 +2250,7 @@ export class DxTreeListComponent extends DxComponent { subscribe: 'toolbarPreparing', emit: 'onToolbarPreparing' }, { emit: 'accessKeyChange' }, { emit: 'activeStateEnabledChange' }, + { emit: 'aiAssistantChange' }, { emit: 'aiIntegrationChange' }, { emit: 'allowColumnReorderingChange' }, { emit: 'allowColumnResizingChange' }, @@ -2374,15 +2436,22 @@ export class DxTreeListComponent extends DxComponent DxoStateStoringModule, DxoToolbarModule, DxoTreeListAIModule, + DxoTreeListAIAssistantModule, DxoTreeListAIOptionsModule, + DxiTreeListAlertModule, DxoTreeListAnimationModule, DxiTreeListAsyncRuleModule, DxoTreeListAtModule, + DxiTreeListAttachmentModule, + DxoTreeListAuthorModule, DxoTreeListBoundaryOffsetModule, DxiTreeListButtonModule, DxiTreeListButtonItemModule, DxoTreeListButtonOptionsModule, DxiTreeListChangeModule, + DxoTreeListChatModule, + DxoTreeListChatEditingModule, + DxiTreeListChatItemModule, DxoTreeListColCountByScreenModule, DxoTreeListCollisionModule, DxiTreeListColumnModule, @@ -2399,14 +2468,16 @@ export class DxTreeListComponent extends DxComponent DxoTreeListCursorOffsetModule, DxiTreeListCustomOperationModule, DxiTreeListCustomRuleModule, + DxoTreeListCustomSpeechRecognizerModule, + DxoTreeListDayHeaderFormatModule, DxoTreeListEditingModule, - DxoTreeListEditingTextsModule, DxoTreeListEditorOptionsModule, DxiTreeListEditorOptionsButtonModule, DxiTreeListEmailRuleModule, DxiTreeListEmptyItemModule, DxiTreeListFieldModule, DxoTreeListFieldLookupModule, + DxoTreeListFileUploaderOptionsModule, DxoTreeListFilterBuilderModule, DxoTreeListFilterBuilderPopupModule, DxoTreeListFilterOperationDescriptionsModule, @@ -2428,6 +2499,7 @@ export class DxTreeListComponent extends DxComponent DxoTreeListLabelModule, DxoTreeListLoadPanelModule, DxoTreeListLookupModule, + DxoTreeListMessageTimestampFormatModule, DxoTreeListMyModule, DxiTreeListNumericRuleModule, DxoTreeListOffsetModule, @@ -2446,9 +2518,12 @@ export class DxTreeListComponent extends DxComponent DxoTreeListSearchModule, DxoTreeListSearchPanelModule, DxoTreeListSelectionModule, + DxoTreeListSendButtonOptionsModule, DxoTreeListShowModule, DxiTreeListSimpleItemModule, DxoTreeListSortingModule, + DxoTreeListSpeechRecognitionConfigModule, + DxoTreeListSpeechToTextOptionsModule, DxoTreeListStateStoringModule, DxiTreeListStringLengthRuleModule, DxiTreeListTabModule, @@ -2459,11 +2534,15 @@ export class DxTreeListComponent extends DxComponent DxoTreeListToModule, DxoTreeListToolbarModule, DxiTreeListToolbarItemModule, + DxoTreeListTreeListEditingModule, + DxoTreeListTreeListEditingTextsModule, DxoTreeListTreeListHeaderFilterModule, DxoTreeListTreeListHeaderFilterSearchModule, DxoTreeListTreeListHeaderFilterTextsModule, DxoTreeListTreeListSelectionModule, DxiTreeListTreeListToolbarItemModule, + DxiTreeListTypingUserModule, + DxoTreeListUserModule, DxiTreeListValidationRuleModule, DxIntegrationModule, DxTemplateModule @@ -2526,15 +2605,22 @@ export class DxTreeListComponent extends DxComponent DxoStateStoringModule, DxoToolbarModule, DxoTreeListAIModule, + DxoTreeListAIAssistantModule, DxoTreeListAIOptionsModule, + DxiTreeListAlertModule, DxoTreeListAnimationModule, DxiTreeListAsyncRuleModule, DxoTreeListAtModule, + DxiTreeListAttachmentModule, + DxoTreeListAuthorModule, DxoTreeListBoundaryOffsetModule, DxiTreeListButtonModule, DxiTreeListButtonItemModule, DxoTreeListButtonOptionsModule, DxiTreeListChangeModule, + DxoTreeListChatModule, + DxoTreeListChatEditingModule, + DxiTreeListChatItemModule, DxoTreeListColCountByScreenModule, DxoTreeListCollisionModule, DxiTreeListColumnModule, @@ -2551,14 +2637,16 @@ export class DxTreeListComponent extends DxComponent DxoTreeListCursorOffsetModule, DxiTreeListCustomOperationModule, DxiTreeListCustomRuleModule, + DxoTreeListCustomSpeechRecognizerModule, + DxoTreeListDayHeaderFormatModule, DxoTreeListEditingModule, - DxoTreeListEditingTextsModule, DxoTreeListEditorOptionsModule, DxiTreeListEditorOptionsButtonModule, DxiTreeListEmailRuleModule, DxiTreeListEmptyItemModule, DxiTreeListFieldModule, DxoTreeListFieldLookupModule, + DxoTreeListFileUploaderOptionsModule, DxoTreeListFilterBuilderModule, DxoTreeListFilterBuilderPopupModule, DxoTreeListFilterOperationDescriptionsModule, @@ -2580,6 +2668,7 @@ export class DxTreeListComponent extends DxComponent DxoTreeListLabelModule, DxoTreeListLoadPanelModule, DxoTreeListLookupModule, + DxoTreeListMessageTimestampFormatModule, DxoTreeListMyModule, DxiTreeListNumericRuleModule, DxoTreeListOffsetModule, @@ -2598,9 +2687,12 @@ export class DxTreeListComponent extends DxComponent DxoTreeListSearchModule, DxoTreeListSearchPanelModule, DxoTreeListSelectionModule, + DxoTreeListSendButtonOptionsModule, DxoTreeListShowModule, DxiTreeListSimpleItemModule, DxoTreeListSortingModule, + DxoTreeListSpeechRecognitionConfigModule, + DxoTreeListSpeechToTextOptionsModule, DxoTreeListStateStoringModule, DxiTreeListStringLengthRuleModule, DxiTreeListTabModule, @@ -2611,11 +2703,15 @@ export class DxTreeListComponent extends DxComponent DxoTreeListToModule, DxoTreeListToolbarModule, DxiTreeListToolbarItemModule, + DxoTreeListTreeListEditingModule, + DxoTreeListTreeListEditingTextsModule, DxoTreeListTreeListHeaderFilterModule, DxoTreeListTreeListHeaderFilterSearchModule, DxoTreeListTreeListHeaderFilterTextsModule, DxoTreeListTreeListSelectionModule, DxiTreeListTreeListToolbarItemModule, + DxiTreeListTypingUserModule, + DxoTreeListUserModule, DxiTreeListValidationRuleModule, DxTemplateModule ] diff --git a/packages/devextreme-angular/src/ui/tree-list/nested/ai-assistant.ts b/packages/devextreme-angular/src/ui/tree-list/nested/ai-assistant.ts new file mode 100644 index 000000000000..b6e783e6d661 --- /dev/null +++ b/packages/devextreme-angular/src/ui/tree-list/nested/ai-assistant.ts @@ -0,0 +1,110 @@ +/* tslint:disable:max-line-length */ + + +import { + Component, + OnInit, + OnDestroy, + NgModule, + Host, + SkipSelf, + Input +} from '@angular/core'; + + + + +import type { AIIntegration } from 'devextreme/common/ai-integration'; +import type { dxChatOptions } from 'devextreme/ui/chat'; +import type { dxPopupOptions } from 'devextreme/ui/popup'; + +import { + DxIntegrationModule, + NestedOptionHost, +} from 'devextreme-angular/core'; +import { NestedOption } from 'devextreme-angular/core'; + + +@Component({ + selector: 'dxo-tree-list-ai-assistant', + standalone: true, + template: '', + styles: [''], + imports: [ DxIntegrationModule ], + providers: [NestedOptionHost] +}) +export class DxoTreeListAIAssistantComponent extends NestedOption implements OnDestroy, OnInit { + @Input() + get aiIntegration(): AIIntegration { + return this._getOption('aiIntegration'); + } + set aiIntegration(value: AIIntegration) { + this._setOption('aiIntegration', value); + } + + @Input() + get chat(): dxChatOptions { + return this._getOption('chat'); + } + set chat(value: dxChatOptions) { + this._setOption('chat', value); + } + + @Input() + get enabled(): boolean { + return this._getOption('enabled'); + } + set enabled(value: boolean) { + this._setOption('enabled', value); + } + + @Input() + get popup(): dxPopupOptions { + return this._getOption('popup'); + } + set popup(value: dxPopupOptions) { + this._setOption('popup', value); + } + + @Input() + get title(): string { + return this._getOption('title'); + } + set title(value: string) { + this._setOption('title', value); + } + + + protected get _optionPath() { + return 'aiAssistant'; + } + + + constructor(@SkipSelf() @Host() parentOptionHost: NestedOptionHost, + @Host() optionHost: NestedOptionHost) { + super(); + parentOptionHost.setNestedOption(this); + optionHost.setHost(this, this._fullOptionPath.bind(this)); + } + + + ngOnInit() { + this._addRecreatedComponent(); + } + + ngOnDestroy() { + this._addRemovedOption(this._getOptionPath()); + } + + +} + +@NgModule({ + imports: [ + DxoTreeListAIAssistantComponent + ], + exports: [ + DxoTreeListAIAssistantComponent + ], +}) +export class DxoTreeListAIAssistantModule { } diff --git a/packages/devextreme-angular/src/ui/tree-list/nested/alert-dxi.ts b/packages/devextreme-angular/src/ui/tree-list/nested/alert-dxi.ts new file mode 100644 index 000000000000..54372eafab9d --- /dev/null +++ b/packages/devextreme-angular/src/ui/tree-list/nested/alert-dxi.ts @@ -0,0 +1,84 @@ +/* tslint:disable:max-line-length */ + + +import { + Component, + NgModule, + Host, + SkipSelf, + Input +} from '@angular/core'; + + + + + +import { + DxIntegrationModule, + NestedOptionHost, +} from 'devextreme-angular/core'; +import { CollectionNestedOption } from 'devextreme-angular/core'; + +import { PROPERTY_TOKEN_alerts } from 'devextreme-angular/core/tokens'; + +@Component({ + selector: 'dxi-tree-list-alert', + standalone: true, + template: '', + styles: [''], + imports: [ DxIntegrationModule ], + providers: [ + NestedOptionHost, + { + provide: PROPERTY_TOKEN_alerts, + useExisting: DxiTreeListAlertComponent, + } + ] +}) +export class DxiTreeListAlertComponent extends CollectionNestedOption { + @Input() + get id(): number | string { + return this._getOption('id'); + } + set id(value: number | string) { + this._setOption('id', value); + } + + @Input() + get message(): string { + return this._getOption('message'); + } + set message(value: string) { + this._setOption('message', value); + } + + + protected get _optionPath() { + return 'alerts'; + } + + + constructor(@SkipSelf() @Host() parentOptionHost: NestedOptionHost, + @Host() optionHost: NestedOptionHost) { + super(); + parentOptionHost.setNestedOption(this); + optionHost.setHost(this, this._fullOptionPath.bind(this)); + } + + + + ngOnDestroy() { + this._deleteRemovedOptions(this._fullOptionPath()); + } + +} + +@NgModule({ + imports: [ + DxiTreeListAlertComponent + ], + exports: [ + DxiTreeListAlertComponent + ], +}) +export class DxiTreeListAlertModule { } diff --git a/packages/devextreme-angular/src/ui/tree-list/nested/attachment-dxi.ts b/packages/devextreme-angular/src/ui/tree-list/nested/attachment-dxi.ts new file mode 100644 index 000000000000..1e378fc01f98 --- /dev/null +++ b/packages/devextreme-angular/src/ui/tree-list/nested/attachment-dxi.ts @@ -0,0 +1,84 @@ +/* tslint:disable:max-line-length */ + + +import { + Component, + NgModule, + Host, + SkipSelf, + Input +} from '@angular/core'; + + + + + +import { + DxIntegrationModule, + NestedOptionHost, +} from 'devextreme-angular/core'; +import { CollectionNestedOption } from 'devextreme-angular/core'; + +import { PROPERTY_TOKEN_attachments } from 'devextreme-angular/core/tokens'; + +@Component({ + selector: 'dxi-tree-list-attachment', + standalone: true, + template: '', + styles: [''], + imports: [ DxIntegrationModule ], + providers: [ + NestedOptionHost, + { + provide: PROPERTY_TOKEN_attachments, + useExisting: DxiTreeListAttachmentComponent, + } + ] +}) +export class DxiTreeListAttachmentComponent extends CollectionNestedOption { + @Input() + get name(): string { + return this._getOption('name'); + } + set name(value: string) { + this._setOption('name', value); + } + + @Input() + get size(): number { + return this._getOption('size'); + } + set size(value: number) { + this._setOption('size', value); + } + + + protected get _optionPath() { + return 'attachments'; + } + + + constructor(@SkipSelf() @Host() parentOptionHost: NestedOptionHost, + @Host() optionHost: NestedOptionHost) { + super(); + parentOptionHost.setNestedOption(this); + optionHost.setHost(this, this._fullOptionPath.bind(this)); + } + + + + ngOnDestroy() { + this._deleteRemovedOptions(this._fullOptionPath()); + } + +} + +@NgModule({ + imports: [ + DxiTreeListAttachmentComponent + ], + exports: [ + DxiTreeListAttachmentComponent + ], +}) +export class DxiTreeListAttachmentModule { } diff --git a/packages/devextreme-angular/src/ui/tree-list/nested/author.ts b/packages/devextreme-angular/src/ui/tree-list/nested/author.ts new file mode 100644 index 000000000000..9effe4bf0568 --- /dev/null +++ b/packages/devextreme-angular/src/ui/tree-list/nested/author.ts @@ -0,0 +1,99 @@ +/* tslint:disable:max-line-length */ + + +import { + Component, + OnInit, + OnDestroy, + NgModule, + Host, + SkipSelf, + Input +} from '@angular/core'; + + + + + +import { + DxIntegrationModule, + NestedOptionHost, +} from 'devextreme-angular/core'; +import { NestedOption } from 'devextreme-angular/core'; + + +@Component({ + selector: 'dxo-tree-list-author', + standalone: true, + template: '', + styles: [''], + imports: [ DxIntegrationModule ], + providers: [NestedOptionHost] +}) +export class DxoTreeListAuthorComponent extends NestedOption implements OnDestroy, OnInit { + @Input() + get avatarAlt(): string { + return this._getOption('avatarAlt'); + } + set avatarAlt(value: string) { + this._setOption('avatarAlt', value); + } + + @Input() + get avatarUrl(): string { + return this._getOption('avatarUrl'); + } + set avatarUrl(value: string) { + this._setOption('avatarUrl', value); + } + + @Input() + get id(): number | string { + return this._getOption('id'); + } + set id(value: number | string) { + this._setOption('id', value); + } + + @Input() + get name(): string { + return this._getOption('name'); + } + set name(value: string) { + this._setOption('name', value); + } + + + protected get _optionPath() { + return 'author'; + } + + + constructor(@SkipSelf() @Host() parentOptionHost: NestedOptionHost, + @Host() optionHost: NestedOptionHost) { + super(); + parentOptionHost.setNestedOption(this); + optionHost.setHost(this, this._fullOptionPath.bind(this)); + } + + + ngOnInit() { + this._addRecreatedComponent(); + } + + ngOnDestroy() { + this._addRemovedOption(this._getOptionPath()); + } + + +} + +@NgModule({ + imports: [ + DxoTreeListAuthorComponent + ], + exports: [ + DxoTreeListAuthorComponent + ], +}) +export class DxoTreeListAuthorModule { } diff --git a/packages/devextreme-angular/src/ui/tree-list/nested/chat-editing.ts b/packages/devextreme-angular/src/ui/tree-list/nested/chat-editing.ts new file mode 100644 index 000000000000..623b36c3e172 --- /dev/null +++ b/packages/devextreme-angular/src/ui/tree-list/nested/chat-editing.ts @@ -0,0 +1,84 @@ +/* tslint:disable:max-line-length */ + + +import { + Component, + OnInit, + OnDestroy, + NgModule, + Host, + SkipSelf, + Input +} from '@angular/core'; + + + + +import type { default as dxChat, Message } from 'devextreme/ui/chat'; + +import { + DxIntegrationModule, + NestedOptionHost, +} from 'devextreme-angular/core'; +import { NestedOption } from 'devextreme-angular/core'; + + +@Component({ + selector: 'dxo-tree-list-chat-editing', + standalone: true, + template: '', + styles: [''], + imports: [ DxIntegrationModule ], + providers: [NestedOptionHost] +}) +export class DxoTreeListChatEditingComponent extends NestedOption implements OnDestroy, OnInit { + @Input() + get allowDeleting(): boolean | ((options: { component: dxChat, message: Message }) => boolean) { + return this._getOption('allowDeleting'); + } + set allowDeleting(value: boolean | ((options: { component: dxChat, message: Message }) => boolean)) { + this._setOption('allowDeleting', value); + } + + @Input() + get allowUpdating(): boolean | ((options: { component: dxChat, message: Message }) => boolean) { + return this._getOption('allowUpdating'); + } + set allowUpdating(value: boolean | ((options: { component: dxChat, message: Message }) => boolean)) { + this._setOption('allowUpdating', value); + } + + + protected get _optionPath() { + return 'editing'; + } + + + constructor(@SkipSelf() @Host() parentOptionHost: NestedOptionHost, + @Host() optionHost: NestedOptionHost) { + super(); + parentOptionHost.setNestedOption(this); + optionHost.setHost(this, this._fullOptionPath.bind(this)); + } + + + ngOnInit() { + this._addRecreatedComponent(); + } + + ngOnDestroy() { + this._addRemovedOption(this._getOptionPath()); + } + + +} + +@NgModule({ + imports: [ + DxoTreeListChatEditingComponent + ], + exports: [ + DxoTreeListChatEditingComponent + ], +}) +export class DxoTreeListChatEditingModule { } diff --git a/packages/devextreme-angular/src/ui/tree-list/nested/chat-item-dxi.ts b/packages/devextreme-angular/src/ui/tree-list/nested/chat-item-dxi.ts new file mode 100644 index 000000000000..2e1204349eb8 --- /dev/null +++ b/packages/devextreme-angular/src/ui/tree-list/nested/chat-item-dxi.ts @@ -0,0 +1,159 @@ +/* tslint:disable:max-line-length */ + + +import { + Component, + NgModule, + Host, + SkipSelf, + Input, + ContentChildren, + QueryList +} from '@angular/core'; + + + + +import type { Attachment, User } from 'devextreme/ui/chat'; + +import { + DxIntegrationModule, + NestedOptionHost, +} from 'devextreme-angular/core'; +import { CollectionNestedOption } from 'devextreme-angular/core'; + +import { PROPERTY_TOKEN_items } from 'devextreme-angular/core/tokens'; +import { + PROPERTY_TOKEN_attachments, +} from 'devextreme-angular/core/tokens'; + +@Component({ + selector: 'dxi-tree-list-chat-item', + standalone: true, + template: '', + styles: [''], + imports: [ DxIntegrationModule ], + providers: [ + NestedOptionHost, + { + provide: PROPERTY_TOKEN_items, + useExisting: DxiTreeListChatItemComponent, + } + ] +}) +export class DxiTreeListChatItemComponent extends CollectionNestedOption { + @ContentChildren(PROPERTY_TOKEN_attachments) + set _attachmentsContentChildren(value: QueryList) { + this.setChildren('attachments', value); + } + + @Input() + get alt(): string { + return this._getOption('alt'); + } + set alt(value: string) { + this._setOption('alt', value); + } + + @Input() + get attachments(): Array { + return this._getOption('attachments'); + } + set attachments(value: Array) { + this._setOption('attachments', value); + } + + @Input() + get author(): User { + return this._getOption('author'); + } + set author(value: User) { + this._setOption('author', value); + } + + @Input() + get id(): number | string { + return this._getOption('id'); + } + set id(value: number | string) { + this._setOption('id', value); + } + + @Input() + get isDeleted(): boolean { + return this._getOption('isDeleted'); + } + set isDeleted(value: boolean) { + this._setOption('isDeleted', value); + } + + @Input() + get isEdited(): boolean { + return this._getOption('isEdited'); + } + set isEdited(value: boolean) { + this._setOption('isEdited', value); + } + + @Input() + get src(): string { + return this._getOption('src'); + } + set src(value: string) { + this._setOption('src', value); + } + + @Input() + get text(): string { + return this._getOption('text'); + } + set text(value: string) { + this._setOption('text', value); + } + + @Input() + get timestamp(): Date | number | string { + return this._getOption('timestamp'); + } + set timestamp(value: Date | number | string) { + this._setOption('timestamp', value); + } + + @Input() + get type(): string | undefined { + return this._getOption('type'); + } + set type(value: string | undefined) { + this._setOption('type', value); + } + + + protected get _optionPath() { + return 'items'; + } + + + constructor(@SkipSelf() @Host() parentOptionHost: NestedOptionHost, + @Host() optionHost: NestedOptionHost) { + super(); + parentOptionHost.setNestedOption(this); + optionHost.setHost(this, this._fullOptionPath.bind(this)); + } + + + + ngOnDestroy() { + this._deleteRemovedOptions(this._fullOptionPath()); + } + +} + +@NgModule({ + imports: [ + DxiTreeListChatItemComponent + ], + exports: [ + DxiTreeListChatItemComponent + ], +}) +export class DxiTreeListChatItemModule { } diff --git a/packages/devextreme-angular/src/ui/tree-list/nested/chat.ts b/packages/devextreme-angular/src/ui/tree-list/nested/chat.ts new file mode 100644 index 000000000000..c6c4fb7b0c04 --- /dev/null +++ b/packages/devextreme-angular/src/ui/tree-list/nested/chat.ts @@ -0,0 +1,468 @@ +/* tslint:disable:max-line-length */ + + +import { + Component, + OnInit, + OnDestroy, + NgModule, + Host, + SkipSelf, + Input, + Output, + EventEmitter, + ContentChildren, + QueryList +} from '@angular/core'; + + + + +import type { default as dxChat, Alert, Message, AttachmentDownloadClickEvent, DisposingEvent, InitializedEvent, InputFieldTextChangedEvent, MessageDeletedEvent, MessageDeletingEvent, MessageEditCanceledEvent, MessageEditingStartEvent, MessageEnteredEvent, MessageUpdatedEvent, MessageUpdatingEvent, OptionChangedEvent, TypingEndEvent, TypingStartEvent, SendButtonProperties, User } from 'devextreme/ui/chat'; +import type { default as DataSource, DataSourceOptions } from 'devextreme/data/data_source'; +import type { Store } from 'devextreme/data/store'; +import type { Format } from 'devextreme/common/core/localization'; +import type { dxFileUploaderOptions } from 'devextreme/ui/file_uploader'; +import type { dxSpeechToTextOptions } from 'devextreme/ui/speech_to_text'; + +import { + DxIntegrationModule, + NestedOptionHost, + CollectionNestedOption, +} from 'devextreme-angular/core'; +import { NestedOption } from 'devextreme-angular/core'; + +import { + PROPERTY_TOKEN_alerts, + PROPERTY_TOKEN_items, + PROPERTY_TOKEN_typingUsers, +} from 'devextreme-angular/core/tokens'; + +@Component({ + selector: 'dxo-tree-list-chat', + standalone: true, + template: '', + styles: [''], + imports: [ DxIntegrationModule ], + providers: [NestedOptionHost] +}) +export class DxoTreeListChatComponent extends NestedOption implements OnDestroy, OnInit { + @ContentChildren(PROPERTY_TOKEN_alerts) + set _alertsContentChildren(value: QueryList) { + this.setChildren('alerts', value); + } + + @ContentChildren(PROPERTY_TOKEN_items) + set _itemsContentChildren(value: QueryList) { + this.setChildren('items', value); + } + + @ContentChildren(PROPERTY_TOKEN_typingUsers) + set _typingUsersContentChildren(value: QueryList) { + this.setChildren('typingUsers', value); + } + + @Input() + get accessKey(): string | undefined { + return this._getOption('accessKey'); + } + set accessKey(value: string | undefined) { + this._setOption('accessKey', value); + } + + @Input() + get activeStateEnabled(): boolean { + return this._getOption('activeStateEnabled'); + } + set activeStateEnabled(value: boolean) { + this._setOption('activeStateEnabled', value); + } + + @Input() + get alerts(): Array { + return this._getOption('alerts'); + } + set alerts(value: Array) { + this._setOption('alerts', value); + } + + @Input() + get dataSource(): Array | DataSource | DataSourceOptions | null | Store | string { + return this._getOption('dataSource'); + } + set dataSource(value: Array | DataSource | DataSourceOptions | null | Store | string) { + this._setOption('dataSource', value); + } + + @Input() + get dayHeaderFormat(): Format { + return this._getOption('dayHeaderFormat'); + } + set dayHeaderFormat(value: Format) { + this._setOption('dayHeaderFormat', value); + } + + @Input() + get disabled(): boolean { + return this._getOption('disabled'); + } + set disabled(value: boolean) { + this._setOption('disabled', value); + } + + @Input() + get editing(): { allowDeleting?: boolean | ((options: { component: dxChat, message: Message }) => boolean), allowUpdating?: boolean | ((options: { component: dxChat, message: Message }) => boolean) } { + return this._getOption('editing'); + } + set editing(value: { allowDeleting?: boolean | ((options: { component: dxChat, message: Message }) => boolean), allowUpdating?: boolean | ((options: { component: dxChat, message: Message }) => boolean) }) { + this._setOption('editing', value); + } + + @Input() + get elementAttr(): Record { + return this._getOption('elementAttr'); + } + set elementAttr(value: Record) { + this._setOption('elementAttr', value); + } + + @Input() + get emptyViewTemplate(): any { + return this._getOption('emptyViewTemplate'); + } + set emptyViewTemplate(value: any) { + this._setOption('emptyViewTemplate', value); + } + + @Input() + get fileUploaderOptions(): dxFileUploaderOptions { + return this._getOption('fileUploaderOptions'); + } + set fileUploaderOptions(value: dxFileUploaderOptions) { + this._setOption('fileUploaderOptions', value); + } + + @Input() + get focusStateEnabled(): boolean { + return this._getOption('focusStateEnabled'); + } + set focusStateEnabled(value: boolean) { + this._setOption('focusStateEnabled', value); + } + + @Input() + get height(): number | string | undefined { + return this._getOption('height'); + } + set height(value: number | string | undefined) { + this._setOption('height', value); + } + + @Input() + get hint(): string | undefined { + return this._getOption('hint'); + } + set hint(value: string | undefined) { + this._setOption('hint', value); + } + + @Input() + get hoverStateEnabled(): boolean { + return this._getOption('hoverStateEnabled'); + } + set hoverStateEnabled(value: boolean) { + this._setOption('hoverStateEnabled', value); + } + + @Input() + get inputFieldText(): string | undefined { + return this._getOption('inputFieldText'); + } + set inputFieldText(value: string | undefined) { + this._setOption('inputFieldText', value); + } + + @Input() + get items(): Array { + return this._getOption('items'); + } + set items(value: Array) { + this._setOption('items', value); + } + + @Input() + get messageTemplate(): any { + return this._getOption('messageTemplate'); + } + set messageTemplate(value: any) { + this._setOption('messageTemplate', value); + } + + @Input() + get messageTimestampFormat(): Format { + return this._getOption('messageTimestampFormat'); + } + set messageTimestampFormat(value: Format) { + this._setOption('messageTimestampFormat', value); + } + + @Input() + get onAttachmentDownloadClick(): ((e: AttachmentDownloadClickEvent) => void) | undefined { + return this._getOption('onAttachmentDownloadClick'); + } + set onAttachmentDownloadClick(value: ((e: AttachmentDownloadClickEvent) => void) | undefined) { + this._setOption('onAttachmentDownloadClick', value); + } + + @Input() + get onDisposing(): ((e: DisposingEvent) => void) { + return this._getOption('onDisposing'); + } + set onDisposing(value: ((e: DisposingEvent) => void)) { + this._setOption('onDisposing', value); + } + + @Input() + get onInitialized(): ((e: InitializedEvent) => void) { + return this._getOption('onInitialized'); + } + set onInitialized(value: ((e: InitializedEvent) => void)) { + this._setOption('onInitialized', value); + } + + @Input() + get onInputFieldTextChanged(): ((e: InputFieldTextChangedEvent) => void) | undefined { + return this._getOption('onInputFieldTextChanged'); + } + set onInputFieldTextChanged(value: ((e: InputFieldTextChangedEvent) => void) | undefined) { + this._setOption('onInputFieldTextChanged', value); + } + + @Input() + get onMessageDeleted(): ((e: MessageDeletedEvent) => void) | undefined { + return this._getOption('onMessageDeleted'); + } + set onMessageDeleted(value: ((e: MessageDeletedEvent) => void) | undefined) { + this._setOption('onMessageDeleted', value); + } + + @Input() + get onMessageDeleting(): ((e: MessageDeletingEvent) => void) | undefined { + return this._getOption('onMessageDeleting'); + } + set onMessageDeleting(value: ((e: MessageDeletingEvent) => void) | undefined) { + this._setOption('onMessageDeleting', value); + } + + @Input() + get onMessageEditCanceled(): ((e: MessageEditCanceledEvent) => void) | undefined { + return this._getOption('onMessageEditCanceled'); + } + set onMessageEditCanceled(value: ((e: MessageEditCanceledEvent) => void) | undefined) { + this._setOption('onMessageEditCanceled', value); + } + + @Input() + get onMessageEditingStart(): ((e: MessageEditingStartEvent) => void) | undefined { + return this._getOption('onMessageEditingStart'); + } + set onMessageEditingStart(value: ((e: MessageEditingStartEvent) => void) | undefined) { + this._setOption('onMessageEditingStart', value); + } + + @Input() + get onMessageEntered(): ((e: MessageEnteredEvent) => void) | undefined { + return this._getOption('onMessageEntered'); + } + set onMessageEntered(value: ((e: MessageEnteredEvent) => void) | undefined) { + this._setOption('onMessageEntered', value); + } + + @Input() + get onMessageUpdated(): ((e: MessageUpdatedEvent) => void) | undefined { + return this._getOption('onMessageUpdated'); + } + set onMessageUpdated(value: ((e: MessageUpdatedEvent) => void) | undefined) { + this._setOption('onMessageUpdated', value); + } + + @Input() + get onMessageUpdating(): ((e: MessageUpdatingEvent) => void) | undefined { + return this._getOption('onMessageUpdating'); + } + set onMessageUpdating(value: ((e: MessageUpdatingEvent) => void) | undefined) { + this._setOption('onMessageUpdating', value); + } + + @Input() + get onOptionChanged(): ((e: OptionChangedEvent) => void) { + return this._getOption('onOptionChanged'); + } + set onOptionChanged(value: ((e: OptionChangedEvent) => void)) { + this._setOption('onOptionChanged', value); + } + + @Input() + get onTypingEnd(): ((e: TypingEndEvent) => void) | undefined { + return this._getOption('onTypingEnd'); + } + set onTypingEnd(value: ((e: TypingEndEvent) => void) | undefined) { + this._setOption('onTypingEnd', value); + } + + @Input() + get onTypingStart(): ((e: TypingStartEvent) => void) | undefined { + return this._getOption('onTypingStart'); + } + set onTypingStart(value: ((e: TypingStartEvent) => void) | undefined) { + this._setOption('onTypingStart', value); + } + + @Input() + get reloadOnChange(): boolean { + return this._getOption('reloadOnChange'); + } + set reloadOnChange(value: boolean) { + this._setOption('reloadOnChange', value); + } + + @Input() + get rtlEnabled(): boolean { + return this._getOption('rtlEnabled'); + } + set rtlEnabled(value: boolean) { + this._setOption('rtlEnabled', value); + } + + @Input() + get sendButtonOptions(): SendButtonProperties { + return this._getOption('sendButtonOptions'); + } + set sendButtonOptions(value: SendButtonProperties) { + this._setOption('sendButtonOptions', value); + } + + @Input() + get showAvatar(): boolean { + return this._getOption('showAvatar'); + } + set showAvatar(value: boolean) { + this._setOption('showAvatar', value); + } + + @Input() + get showDayHeaders(): boolean { + return this._getOption('showDayHeaders'); + } + set showDayHeaders(value: boolean) { + this._setOption('showDayHeaders', value); + } + + @Input() + get showMessageTimestamp(): boolean { + return this._getOption('showMessageTimestamp'); + } + set showMessageTimestamp(value: boolean) { + this._setOption('showMessageTimestamp', value); + } + + @Input() + get showUserName(): boolean { + return this._getOption('showUserName'); + } + set showUserName(value: boolean) { + this._setOption('showUserName', value); + } + + @Input() + get speechToTextEnabled(): boolean { + return this._getOption('speechToTextEnabled'); + } + set speechToTextEnabled(value: boolean) { + this._setOption('speechToTextEnabled', value); + } + + @Input() + get speechToTextOptions(): dxSpeechToTextOptions { + return this._getOption('speechToTextOptions'); + } + set speechToTextOptions(value: dxSpeechToTextOptions) { + this._setOption('speechToTextOptions', value); + } + + @Input() + get typingUsers(): Array { + return this._getOption('typingUsers'); + } + set typingUsers(value: Array) { + this._setOption('typingUsers', value); + } + + @Input() + get user(): User { + return this._getOption('user'); + } + set user(value: User) { + this._setOption('user', value); + } + + @Input() + get visible(): boolean { + return this._getOption('visible'); + } + set visible(value: boolean) { + this._setOption('visible', value); + } + + @Input() + get width(): number | string | undefined { + return this._getOption('width'); + } + set width(value: number | string | undefined) { + this._setOption('width', value); + } + + + /** + + * This member supports the internal infrastructure and is not intended to be used directly from your code. + + */ + @Output() itemsChange: EventEmitter>; + protected get _optionPath() { + return 'chat'; + } + + + constructor(@SkipSelf() @Host() parentOptionHost: NestedOptionHost, + @Host() optionHost: NestedOptionHost) { + super(); + this._createEventEmitters([ + { emit: 'itemsChange' } + ]); + + parentOptionHost.setNestedOption(this); + optionHost.setHost(this, this._fullOptionPath.bind(this)); + } + + + ngOnInit() { + this._addRecreatedComponent(); + } + + ngOnDestroy() { + this._addRemovedOption(this._getOptionPath()); + } + + +} + +@NgModule({ + imports: [ + DxoTreeListChatComponent + ], + exports: [ + DxoTreeListChatComponent + ], +}) +export class DxoTreeListChatModule { } diff --git a/packages/devextreme-angular/src/ui/tree-list/nested/custom-speech-recognizer.ts b/packages/devextreme-angular/src/ui/tree-list/nested/custom-speech-recognizer.ts new file mode 100644 index 000000000000..d46a5d8c6876 --- /dev/null +++ b/packages/devextreme-angular/src/ui/tree-list/nested/custom-speech-recognizer.ts @@ -0,0 +1,83 @@ +/* tslint:disable:max-line-length */ + + +import { + Component, + OnInit, + OnDestroy, + NgModule, + Host, + SkipSelf, + Input +} from '@angular/core'; + + + + + +import { + DxIntegrationModule, + NestedOptionHost, +} from 'devextreme-angular/core'; +import { NestedOption } from 'devextreme-angular/core'; + + +@Component({ + selector: 'dxo-tree-list-custom-speech-recognizer', + standalone: true, + template: '', + styles: [''], + imports: [ DxIntegrationModule ], + providers: [NestedOptionHost] +}) +export class DxoTreeListCustomSpeechRecognizerComponent extends NestedOption implements OnDestroy, OnInit { + @Input() + get enabled(): boolean { + return this._getOption('enabled'); + } + set enabled(value: boolean) { + this._setOption('enabled', value); + } + + @Input() + get isListening(): boolean { + return this._getOption('isListening'); + } + set isListening(value: boolean) { + this._setOption('isListening', value); + } + + + protected get _optionPath() { + return 'customSpeechRecognizer'; + } + + + constructor(@SkipSelf() @Host() parentOptionHost: NestedOptionHost, + @Host() optionHost: NestedOptionHost) { + super(); + parentOptionHost.setNestedOption(this); + optionHost.setHost(this, this._fullOptionPath.bind(this)); + } + + + ngOnInit() { + this._addRecreatedComponent(); + } + + ngOnDestroy() { + this._addRemovedOption(this._getOptionPath()); + } + + +} + +@NgModule({ + imports: [ + DxoTreeListCustomSpeechRecognizerComponent + ], + exports: [ + DxoTreeListCustomSpeechRecognizerComponent + ], +}) +export class DxoTreeListCustomSpeechRecognizerModule { } diff --git a/packages/devextreme-angular/src/ui/tree-list/nested/day-header-format.ts b/packages/devextreme-angular/src/ui/tree-list/nested/day-header-format.ts new file mode 100644 index 000000000000..c4809356092d --- /dev/null +++ b/packages/devextreme-angular/src/ui/tree-list/nested/day-header-format.ts @@ -0,0 +1,116 @@ +/* tslint:disable:max-line-length */ + + +import { + Component, + OnInit, + OnDestroy, + NgModule, + Host, + SkipSelf, + Input +} from '@angular/core'; + + + + +import type { Format } from 'devextreme/common'; + +import { + DxIntegrationModule, + NestedOptionHost, +} from 'devextreme-angular/core'; +import { NestedOption } from 'devextreme-angular/core'; + + +@Component({ + selector: 'dxo-tree-list-day-header-format', + standalone: true, + template: '', + styles: [''], + imports: [ DxIntegrationModule ], + providers: [NestedOptionHost] +}) +export class DxoTreeListDayHeaderFormatComponent extends NestedOption implements OnDestroy, OnInit { + @Input() + get currency(): string { + return this._getOption('currency'); + } + set currency(value: string) { + this._setOption('currency', value); + } + + @Input() + get formatter(): ((value: number | Date) => string) { + return this._getOption('formatter'); + } + set formatter(value: ((value: number | Date) => string)) { + this._setOption('formatter', value); + } + + @Input() + get parser(): ((value: string) => number | Date) { + return this._getOption('parser'); + } + set parser(value: ((value: string) => number | Date)) { + this._setOption('parser', value); + } + + @Input() + get precision(): number { + return this._getOption('precision'); + } + set precision(value: number) { + this._setOption('precision', value); + } + + @Input() + get type(): Format | string { + return this._getOption('type'); + } + set type(value: Format | string) { + this._setOption('type', value); + } + + @Input() + get useCurrencyAccountingStyle(): boolean { + return this._getOption('useCurrencyAccountingStyle'); + } + set useCurrencyAccountingStyle(value: boolean) { + this._setOption('useCurrencyAccountingStyle', value); + } + + + protected get _optionPath() { + return 'dayHeaderFormat'; + } + + + constructor(@SkipSelf() @Host() parentOptionHost: NestedOptionHost, + @Host() optionHost: NestedOptionHost) { + super(); + parentOptionHost.setNestedOption(this); + optionHost.setHost(this, this._fullOptionPath.bind(this)); + } + + + ngOnInit() { + this._addRecreatedComponent(); + } + + ngOnDestroy() { + this._addRemovedOption(this._getOptionPath()); + } + + +} + +@NgModule({ + imports: [ + DxoTreeListDayHeaderFormatComponent + ], + exports: [ + DxoTreeListDayHeaderFormatComponent + ], +}) +export class DxoTreeListDayHeaderFormatModule { } diff --git a/packages/devextreme-angular/src/ui/tree-list/nested/file-uploader-options.ts b/packages/devextreme-angular/src/ui/tree-list/nested/file-uploader-options.ts new file mode 100644 index 000000000000..8193e4ff8831 --- /dev/null +++ b/packages/devextreme-angular/src/ui/tree-list/nested/file-uploader-options.ts @@ -0,0 +1,594 @@ +/* tslint:disable:max-line-length */ + + +import { + Component, + OnInit, + OnDestroy, + NgModule, + Host, + SkipSelf, + Input, + Output, + EventEmitter +} from '@angular/core'; + + + + +import type UploadInfo from 'devextreme/file_management/upload_info'; +import type { BeforeSendEvent, ContentReadyEvent, DisposingEvent, DropZoneEnterEvent, DropZoneLeaveEvent, FilesUploadedEvent, InitializedEvent, OptionChangedEvent, ProgressEvent, UploadAbortedEvent, UploadedEvent, UploadErrorEvent, UploadStartedEvent, ValueChangedEvent, UploadHttpMethod, FileUploadMode } from 'devextreme/ui/file_uploader'; +import type { ValidationStatus } from 'devextreme/common'; + +import { + DxIntegrationModule, + NestedOptionHost, +} from 'devextreme-angular/core'; +import { NestedOption } from 'devextreme-angular/core'; + + +@Component({ + selector: 'dxo-tree-list-file-uploader-options', + standalone: true, + template: '', + styles: [''], + imports: [ DxIntegrationModule ], + providers: [NestedOptionHost] +}) +export class DxoTreeListFileUploaderOptionsComponent extends NestedOption implements OnDestroy, OnInit { + @Input() + get abortUpload(): ((file: any, uploadInfo?: UploadInfo) => any) { + return this._getOption('abortUpload'); + } + set abortUpload(value: ((file: any, uploadInfo?: UploadInfo) => any)) { + this._setOption('abortUpload', value); + } + + @Input() + get accept(): string { + return this._getOption('accept'); + } + set accept(value: string) { + this._setOption('accept', value); + } + + @Input() + get accessKey(): string | undefined { + return this._getOption('accessKey'); + } + set accessKey(value: string | undefined) { + this._setOption('accessKey', value); + } + + @Input() + get activeStateEnabled(): boolean { + return this._getOption('activeStateEnabled'); + } + set activeStateEnabled(value: boolean) { + this._setOption('activeStateEnabled', value); + } + + @Input() + get allowCanceling(): boolean { + return this._getOption('allowCanceling'); + } + set allowCanceling(value: boolean) { + this._setOption('allowCanceling', value); + } + + @Input() + get allowedFileExtensions(): Array { + return this._getOption('allowedFileExtensions'); + } + set allowedFileExtensions(value: Array) { + this._setOption('allowedFileExtensions', value); + } + + @Input() + get chunkSize(): number { + return this._getOption('chunkSize'); + } + set chunkSize(value: number) { + this._setOption('chunkSize', value); + } + + @Input() + get dialogTrigger(): any | string | undefined { + return this._getOption('dialogTrigger'); + } + set dialogTrigger(value: any | string | undefined) { + this._setOption('dialogTrigger', value); + } + + @Input() + get disabled(): boolean { + return this._getOption('disabled'); + } + set disabled(value: boolean) { + this._setOption('disabled', value); + } + + @Input() + get dropZone(): any | string | undefined { + return this._getOption('dropZone'); + } + set dropZone(value: any | string | undefined) { + this._setOption('dropZone', value); + } + + @Input() + get elementAttr(): Record { + return this._getOption('elementAttr'); + } + set elementAttr(value: Record) { + this._setOption('elementAttr', value); + } + + @Input() + get focusStateEnabled(): boolean { + return this._getOption('focusStateEnabled'); + } + set focusStateEnabled(value: boolean) { + this._setOption('focusStateEnabled', value); + } + + @Input() + get height(): number | string | undefined { + return this._getOption('height'); + } + set height(value: number | string | undefined) { + this._setOption('height', value); + } + + @Input() + get hint(): string | undefined { + return this._getOption('hint'); + } + set hint(value: string | undefined) { + this._setOption('hint', value); + } + + @Input() + get hoverStateEnabled(): boolean { + return this._getOption('hoverStateEnabled'); + } + set hoverStateEnabled(value: boolean) { + this._setOption('hoverStateEnabled', value); + } + + @Input() + get inputAttr(): any { + return this._getOption('inputAttr'); + } + set inputAttr(value: any) { + this._setOption('inputAttr', value); + } + + @Input() + get invalidFileExtensionMessage(): string { + return this._getOption('invalidFileExtensionMessage'); + } + set invalidFileExtensionMessage(value: string) { + this._setOption('invalidFileExtensionMessage', value); + } + + @Input() + get invalidMaxFileSizeMessage(): string { + return this._getOption('invalidMaxFileSizeMessage'); + } + set invalidMaxFileSizeMessage(value: string) { + this._setOption('invalidMaxFileSizeMessage', value); + } + + @Input() + get invalidMinFileSizeMessage(): string { + return this._getOption('invalidMinFileSizeMessage'); + } + set invalidMinFileSizeMessage(value: string) { + this._setOption('invalidMinFileSizeMessage', value); + } + + @Input() + get isDirty(): boolean { + return this._getOption('isDirty'); + } + set isDirty(value: boolean) { + this._setOption('isDirty', value); + } + + @Input() + get isValid(): boolean { + return this._getOption('isValid'); + } + set isValid(value: boolean) { + this._setOption('isValid', value); + } + + @Input() + get labelText(): string { + return this._getOption('labelText'); + } + set labelText(value: string) { + this._setOption('labelText', value); + } + + @Input() + get maxFileSize(): number { + return this._getOption('maxFileSize'); + } + set maxFileSize(value: number) { + this._setOption('maxFileSize', value); + } + + @Input() + get minFileSize(): number { + return this._getOption('minFileSize'); + } + set minFileSize(value: number) { + this._setOption('minFileSize', value); + } + + @Input() + get multiple(): boolean { + return this._getOption('multiple'); + } + set multiple(value: boolean) { + this._setOption('multiple', value); + } + + @Input() + get name(): string { + return this._getOption('name'); + } + set name(value: string) { + this._setOption('name', value); + } + + @Input() + get onBeforeSend(): ((e: BeforeSendEvent) => void) { + return this._getOption('onBeforeSend'); + } + set onBeforeSend(value: ((e: BeforeSendEvent) => void)) { + this._setOption('onBeforeSend', value); + } + + @Input() + get onContentReady(): ((e: ContentReadyEvent) => void) { + return this._getOption('onContentReady'); + } + set onContentReady(value: ((e: ContentReadyEvent) => void)) { + this._setOption('onContentReady', value); + } + + @Input() + get onDisposing(): ((e: DisposingEvent) => void) { + return this._getOption('onDisposing'); + } + set onDisposing(value: ((e: DisposingEvent) => void)) { + this._setOption('onDisposing', value); + } + + @Input() + get onDropZoneEnter(): ((e: DropZoneEnterEvent) => void) { + return this._getOption('onDropZoneEnter'); + } + set onDropZoneEnter(value: ((e: DropZoneEnterEvent) => void)) { + this._setOption('onDropZoneEnter', value); + } + + @Input() + get onDropZoneLeave(): ((e: DropZoneLeaveEvent) => void) { + return this._getOption('onDropZoneLeave'); + } + set onDropZoneLeave(value: ((e: DropZoneLeaveEvent) => void)) { + this._setOption('onDropZoneLeave', value); + } + + @Input() + get onFilesUploaded(): ((e: FilesUploadedEvent) => void) { + return this._getOption('onFilesUploaded'); + } + set onFilesUploaded(value: ((e: FilesUploadedEvent) => void)) { + this._setOption('onFilesUploaded', value); + } + + @Input() + get onInitialized(): ((e: InitializedEvent) => void) { + return this._getOption('onInitialized'); + } + set onInitialized(value: ((e: InitializedEvent) => void)) { + this._setOption('onInitialized', value); + } + + @Input() + get onOptionChanged(): ((e: OptionChangedEvent) => void) { + return this._getOption('onOptionChanged'); + } + set onOptionChanged(value: ((e: OptionChangedEvent) => void)) { + this._setOption('onOptionChanged', value); + } + + @Input() + get onProgress(): ((e: ProgressEvent) => void) { + return this._getOption('onProgress'); + } + set onProgress(value: ((e: ProgressEvent) => void)) { + this._setOption('onProgress', value); + } + + @Input() + get onUploadAborted(): ((e: UploadAbortedEvent) => void) { + return this._getOption('onUploadAborted'); + } + set onUploadAborted(value: ((e: UploadAbortedEvent) => void)) { + this._setOption('onUploadAborted', value); + } + + @Input() + get onUploaded(): ((e: UploadedEvent) => void) { + return this._getOption('onUploaded'); + } + set onUploaded(value: ((e: UploadedEvent) => void)) { + this._setOption('onUploaded', value); + } + + @Input() + get onUploadError(): ((e: UploadErrorEvent) => void) { + return this._getOption('onUploadError'); + } + set onUploadError(value: ((e: UploadErrorEvent) => void)) { + this._setOption('onUploadError', value); + } + + @Input() + get onUploadStarted(): ((e: UploadStartedEvent) => void) { + return this._getOption('onUploadStarted'); + } + set onUploadStarted(value: ((e: UploadStartedEvent) => void)) { + this._setOption('onUploadStarted', value); + } + + @Input() + get onValueChanged(): ((e: ValueChangedEvent) => void) { + return this._getOption('onValueChanged'); + } + set onValueChanged(value: ((e: ValueChangedEvent) => void)) { + this._setOption('onValueChanged', value); + } + + @Input() + get progress(): number { + return this._getOption('progress'); + } + set progress(value: number) { + this._setOption('progress', value); + } + + @Input() + get readOnly(): boolean { + return this._getOption('readOnly'); + } + set readOnly(value: boolean) { + this._setOption('readOnly', value); + } + + @Input() + get readyToUploadMessage(): string { + return this._getOption('readyToUploadMessage'); + } + set readyToUploadMessage(value: string) { + this._setOption('readyToUploadMessage', value); + } + + @Input() + get rtlEnabled(): boolean { + return this._getOption('rtlEnabled'); + } + set rtlEnabled(value: boolean) { + this._setOption('rtlEnabled', value); + } + + @Input() + get selectButtonText(): string { + return this._getOption('selectButtonText'); + } + set selectButtonText(value: string) { + this._setOption('selectButtonText', value); + } + + @Input() + get showFileList(): boolean { + return this._getOption('showFileList'); + } + set showFileList(value: boolean) { + this._setOption('showFileList', value); + } + + @Input() + get tabIndex(): number { + return this._getOption('tabIndex'); + } + set tabIndex(value: number) { + this._setOption('tabIndex', value); + } + + @Input() + get uploadAbortedMessage(): string { + return this._getOption('uploadAbortedMessage'); + } + set uploadAbortedMessage(value: string) { + this._setOption('uploadAbortedMessage', value); + } + + @Input() + get uploadButtonText(): string { + return this._getOption('uploadButtonText'); + } + set uploadButtonText(value: string) { + this._setOption('uploadButtonText', value); + } + + @Input() + get uploadChunk(): ((file: any, uploadInfo: UploadInfo) => any) { + return this._getOption('uploadChunk'); + } + set uploadChunk(value: ((file: any, uploadInfo: UploadInfo) => any)) { + this._setOption('uploadChunk', value); + } + + @Input() + get uploadCustomData(): any { + return this._getOption('uploadCustomData'); + } + set uploadCustomData(value: any) { + this._setOption('uploadCustomData', value); + } + + @Input() + get uploadedMessage(): string { + return this._getOption('uploadedMessage'); + } + set uploadedMessage(value: string) { + this._setOption('uploadedMessage', value); + } + + @Input() + get uploadFailedMessage(): string { + return this._getOption('uploadFailedMessage'); + } + set uploadFailedMessage(value: string) { + this._setOption('uploadFailedMessage', value); + } + + @Input() + get uploadFile(): ((file: any, progressCallback: Function) => any) { + return this._getOption('uploadFile'); + } + set uploadFile(value: ((file: any, progressCallback: Function) => any)) { + this._setOption('uploadFile', value); + } + + @Input() + get uploadHeaders(): any { + return this._getOption('uploadHeaders'); + } + set uploadHeaders(value: any) { + this._setOption('uploadHeaders', value); + } + + @Input() + get uploadMethod(): UploadHttpMethod { + return this._getOption('uploadMethod'); + } + set uploadMethod(value: UploadHttpMethod) { + this._setOption('uploadMethod', value); + } + + @Input() + get uploadMode(): FileUploadMode { + return this._getOption('uploadMode'); + } + set uploadMode(value: FileUploadMode) { + this._setOption('uploadMode', value); + } + + @Input() + get uploadUrl(): string { + return this._getOption('uploadUrl'); + } + set uploadUrl(value: string) { + this._setOption('uploadUrl', value); + } + + @Input() + get validationError(): any { + return this._getOption('validationError'); + } + set validationError(value: any) { + this._setOption('validationError', value); + } + + @Input() + get validationErrors(): Array { + return this._getOption('validationErrors'); + } + set validationErrors(value: Array) { + this._setOption('validationErrors', value); + } + + @Input() + get validationStatus(): ValidationStatus { + return this._getOption('validationStatus'); + } + set validationStatus(value: ValidationStatus) { + this._setOption('validationStatus', value); + } + + @Input() + get value(): Array { + return this._getOption('value'); + } + set value(value: Array) { + this._setOption('value', value); + } + + @Input() + get visible(): boolean { + return this._getOption('visible'); + } + set visible(value: boolean) { + this._setOption('visible', value); + } + + @Input() + get width(): number | string | undefined { + return this._getOption('width'); + } + set width(value: number | string | undefined) { + this._setOption('width', value); + } + + + /** + + * This member supports the internal infrastructure and is not intended to be used directly from your code. + + */ + @Output() valueChange: EventEmitter>; + protected get _optionPath() { + return 'fileUploaderOptions'; + } + + + constructor(@SkipSelf() @Host() parentOptionHost: NestedOptionHost, + @Host() optionHost: NestedOptionHost) { + super(); + this._createEventEmitters([ + { emit: 'valueChange' } + ]); + + parentOptionHost.setNestedOption(this); + optionHost.setHost(this, this._fullOptionPath.bind(this)); + } + + + ngOnInit() { + this._addRecreatedComponent(); + } + + ngOnDestroy() { + this._addRemovedOption(this._getOptionPath()); + } + + +} + +@NgModule({ + imports: [ + DxoTreeListFileUploaderOptionsComponent + ], + exports: [ + DxoTreeListFileUploaderOptionsComponent + ], +}) +export class DxoTreeListFileUploaderOptionsModule { } diff --git a/packages/devextreme-angular/src/ui/tree-list/nested/index.ts b/packages/devextreme-angular/src/ui/tree-list/nested/index.ts index 017f7f2588f9..40be9eb5931d 100644 --- a/packages/devextreme-angular/src/ui/tree-list/nested/index.ts +++ b/packages/devextreme-angular/src/ui/tree-list/nested/index.ts @@ -1,13 +1,20 @@ +export * from './ai-assistant'; export * from './ai-options'; export * from './ai'; +export * from './alert-dxi'; export * from './animation'; export * from './async-rule-dxi'; export * from './at'; +export * from './attachment-dxi'; +export * from './author'; export * from './boundary-offset'; export * from './button-dxi'; export * from './button-item-dxi'; export * from './button-options'; export * from './change-dxi'; +export * from './chat-editing'; +export * from './chat-item-dxi'; +export * from './chat'; export * from './col-count-by-screen'; export * from './collision'; export * from './column-button-dxi'; @@ -24,7 +31,8 @@ export * from './compare-rule-dxi'; export * from './cursor-offset'; export * from './custom-operation-dxi'; export * from './custom-rule-dxi'; -export * from './editing-texts'; +export * from './custom-speech-recognizer'; +export * from './day-header-format'; export * from './editing'; export * from './editor-options-button-dxi'; export * from './editor-options'; @@ -32,6 +40,7 @@ export * from './email-rule-dxi'; export * from './empty-item-dxi'; export * from './field-dxi'; export * from './field-lookup'; +export * from './file-uploader-options'; export * from './filter-builder-popup'; export * from './filter-builder'; export * from './filter-operation-descriptions'; @@ -53,6 +62,7 @@ export * from './keyboard-navigation'; export * from './label'; export * from './load-panel'; export * from './lookup'; +export * from './message-timestamp-format'; export * from './my'; export * from './numeric-rule-dxi'; export * from './offset'; @@ -71,9 +81,12 @@ export * from './scrolling'; export * from './search-panel'; export * from './search'; export * from './selection'; +export * from './send-button-options'; export * from './show'; export * from './simple-item-dxi'; export * from './sorting'; +export * from './speech-recognition-config'; +export * from './speech-to-text-options'; export * from './state-storing'; export * from './string-length-rule-dxi'; export * from './tab-dxi'; @@ -84,10 +97,14 @@ export * from './texts'; export * from './to'; export * from './toolbar-item-dxi'; export * from './toolbar'; +export * from './tree-list-editing-texts'; +export * from './tree-list-editing'; export * from './tree-list-header-filter-search'; export * from './tree-list-header-filter-texts'; export * from './tree-list-header-filter'; export * from './tree-list-selection'; export * from './tree-list-toolbar-item-dxi'; +export * from './typing-user-dxi'; +export * from './user'; export * from './validation-rule-dxi'; diff --git a/packages/devextreme-angular/src/ui/tree-list/nested/item-dxi.ts b/packages/devextreme-angular/src/ui/tree-list/nested/item-dxi.ts index 21b5253d7e6f..067721de68e5 100644 --- a/packages/devextreme-angular/src/ui/tree-list/nested/item-dxi.ts +++ b/packages/devextreme-angular/src/ui/tree-list/nested/item-dxi.ts @@ -25,6 +25,7 @@ import type { TreeListPredefinedToolbarItem } from 'devextreme/ui/tree_list'; import type { dxTabPanelOptions } from 'devextreme/ui/tab_panel'; import type { dxButtonOptions } from 'devextreme/ui/button'; import type { LocateInMenuMode, ShowTextMode } from 'devextreme/ui/toolbar'; +import type { Attachment, User } from 'devextreme/ui/chat'; import { DxIntegrationModule, @@ -38,6 +39,7 @@ import { CollectionNestedOption } from 'devextreme-angular/core'; import { PROPERTY_TOKEN_validationRules, + PROPERTY_TOKEN_attachments, PROPERTY_TOKEN_tabs, PROPERTY_TOKEN_items, } from 'devextreme-angular/core/tokens'; @@ -63,6 +65,11 @@ export class DxiTreeListItemComponent extends CollectionNestedOption implements this.setChildren('validationRules', value); } + @ContentChildren(PROPERTY_TOKEN_attachments) + set _attachmentsContentChildren(value: QueryList) { + this.setChildren('attachments', value); + } + @ContentChildren(PROPERTY_TOKEN_tabs) set _tabsContentChildren(value: QueryList) { this.setChildren('tabs', value); @@ -385,6 +392,78 @@ export class DxiTreeListItemComponent extends CollectionNestedOption implements this._setOption('widget', value); } + @Input() + get alt(): string { + return this._getOption('alt'); + } + set alt(value: string) { + this._setOption('alt', value); + } + + @Input() + get attachments(): Array { + return this._getOption('attachments'); + } + set attachments(value: Array) { + this._setOption('attachments', value); + } + + @Input() + get author(): User { + return this._getOption('author'); + } + set author(value: User) { + this._setOption('author', value); + } + + @Input() + get id(): number | string { + return this._getOption('id'); + } + set id(value: number | string) { + this._setOption('id', value); + } + + @Input() + get isDeleted(): boolean { + return this._getOption('isDeleted'); + } + set isDeleted(value: boolean) { + this._setOption('isDeleted', value); + } + + @Input() + get isEdited(): boolean { + return this._getOption('isEdited'); + } + set isEdited(value: boolean) { + this._setOption('isEdited', value); + } + + @Input() + get src(): string { + return this._getOption('src'); + } + set src(value: string) { + this._setOption('src', value); + } + + @Input() + get timestamp(): Date | number | string { + return this._getOption('timestamp'); + } + set timestamp(value: Date | number | string) { + this._setOption('timestamp', value); + } + + @Input() + get type(): string | undefined { + return this._getOption('type'); + } + set type(value: string | undefined) { + this._setOption('type', value); + } + protected get _optionPath() { return 'items'; diff --git a/packages/devextreme-angular/src/ui/tree-list/nested/message-timestamp-format.ts b/packages/devextreme-angular/src/ui/tree-list/nested/message-timestamp-format.ts new file mode 100644 index 000000000000..26f5242c989a --- /dev/null +++ b/packages/devextreme-angular/src/ui/tree-list/nested/message-timestamp-format.ts @@ -0,0 +1,116 @@ +/* tslint:disable:max-line-length */ + + +import { + Component, + OnInit, + OnDestroy, + NgModule, + Host, + SkipSelf, + Input +} from '@angular/core'; + + + + +import type { Format } from 'devextreme/common'; + +import { + DxIntegrationModule, + NestedOptionHost, +} from 'devextreme-angular/core'; +import { NestedOption } from 'devextreme-angular/core'; + + +@Component({ + selector: 'dxo-tree-list-message-timestamp-format', + standalone: true, + template: '', + styles: [''], + imports: [ DxIntegrationModule ], + providers: [NestedOptionHost] +}) +export class DxoTreeListMessageTimestampFormatComponent extends NestedOption implements OnDestroy, OnInit { + @Input() + get currency(): string { + return this._getOption('currency'); + } + set currency(value: string) { + this._setOption('currency', value); + } + + @Input() + get formatter(): ((value: number | Date) => string) { + return this._getOption('formatter'); + } + set formatter(value: ((value: number | Date) => string)) { + this._setOption('formatter', value); + } + + @Input() + get parser(): ((value: string) => number | Date) { + return this._getOption('parser'); + } + set parser(value: ((value: string) => number | Date)) { + this._setOption('parser', value); + } + + @Input() + get precision(): number { + return this._getOption('precision'); + } + set precision(value: number) { + this._setOption('precision', value); + } + + @Input() + get type(): Format | string { + return this._getOption('type'); + } + set type(value: Format | string) { + this._setOption('type', value); + } + + @Input() + get useCurrencyAccountingStyle(): boolean { + return this._getOption('useCurrencyAccountingStyle'); + } + set useCurrencyAccountingStyle(value: boolean) { + this._setOption('useCurrencyAccountingStyle', value); + } + + + protected get _optionPath() { + return 'messageTimestampFormat'; + } + + + constructor(@SkipSelf() @Host() parentOptionHost: NestedOptionHost, + @Host() optionHost: NestedOptionHost) { + super(); + parentOptionHost.setNestedOption(this); + optionHost.setHost(this, this._fullOptionPath.bind(this)); + } + + + ngOnInit() { + this._addRecreatedComponent(); + } + + ngOnDestroy() { + this._addRemovedOption(this._getOptionPath()); + } + + +} + +@NgModule({ + imports: [ + DxoTreeListMessageTimestampFormatComponent + ], + exports: [ + DxoTreeListMessageTimestampFormatComponent + ], +}) +export class DxoTreeListMessageTimestampFormatModule { } diff --git a/packages/devextreme-angular/src/ui/tree-list/nested/send-button-options.ts b/packages/devextreme-angular/src/ui/tree-list/nested/send-button-options.ts new file mode 100644 index 000000000000..eb8b391a54c9 --- /dev/null +++ b/packages/devextreme-angular/src/ui/tree-list/nested/send-button-options.ts @@ -0,0 +1,92 @@ +/* tslint:disable:max-line-length */ + + +import { + Component, + OnInit, + OnDestroy, + NgModule, + Host, + SkipSelf, + Input +} from '@angular/core'; + + + + +import type { SendButtonAction, SendButtonClickEvent } from 'devextreme/ui/chat'; + +import { + DxIntegrationModule, + NestedOptionHost, +} from 'devextreme-angular/core'; +import { NestedOption } from 'devextreme-angular/core'; + + +@Component({ + selector: 'dxo-tree-list-send-button-options', + standalone: true, + template: '', + styles: [''], + imports: [ DxIntegrationModule ], + providers: [NestedOptionHost] +}) +export class DxoTreeListSendButtonOptionsComponent extends NestedOption implements OnDestroy, OnInit { + @Input() + get action(): SendButtonAction { + return this._getOption('action'); + } + set action(value: SendButtonAction) { + this._setOption('action', value); + } + + @Input() + get icon(): string { + return this._getOption('icon'); + } + set icon(value: string) { + this._setOption('icon', value); + } + + @Input() + get onClick(): ((e: SendButtonClickEvent) => void) { + return this._getOption('onClick'); + } + set onClick(value: ((e: SendButtonClickEvent) => void)) { + this._setOption('onClick', value); + } + + + protected get _optionPath() { + return 'sendButtonOptions'; + } + + + constructor(@SkipSelf() @Host() parentOptionHost: NestedOptionHost, + @Host() optionHost: NestedOptionHost) { + super(); + parentOptionHost.setNestedOption(this); + optionHost.setHost(this, this._fullOptionPath.bind(this)); + } + + + ngOnInit() { + this._addRecreatedComponent(); + } + + ngOnDestroy() { + this._addRemovedOption(this._getOptionPath()); + } + + +} + +@NgModule({ + imports: [ + DxoTreeListSendButtonOptionsComponent + ], + exports: [ + DxoTreeListSendButtonOptionsComponent + ], +}) +export class DxoTreeListSendButtonOptionsModule { } diff --git a/packages/devextreme-angular/src/ui/tree-list/nested/speech-recognition-config.ts b/packages/devextreme-angular/src/ui/tree-list/nested/speech-recognition-config.ts new file mode 100644 index 000000000000..ff7554413e51 --- /dev/null +++ b/packages/devextreme-angular/src/ui/tree-list/nested/speech-recognition-config.ts @@ -0,0 +1,107 @@ +/* tslint:disable:max-line-length */ + + +import { + Component, + OnInit, + OnDestroy, + NgModule, + Host, + SkipSelf, + Input +} from '@angular/core'; + + + + + +import { + DxIntegrationModule, + NestedOptionHost, +} from 'devextreme-angular/core'; +import { NestedOption } from 'devextreme-angular/core'; + + +@Component({ + selector: 'dxo-tree-list-speech-recognition-config', + standalone: true, + template: '', + styles: [''], + imports: [ DxIntegrationModule ], + providers: [NestedOptionHost] +}) +export class DxoTreeListSpeechRecognitionConfigComponent extends NestedOption implements OnDestroy, OnInit { + @Input() + get continuous(): boolean { + return this._getOption('continuous'); + } + set continuous(value: boolean) { + this._setOption('continuous', value); + } + + @Input() + get grammars(): Array { + return this._getOption('grammars'); + } + set grammars(value: Array) { + this._setOption('grammars', value); + } + + @Input() + get interimResults(): boolean { + return this._getOption('interimResults'); + } + set interimResults(value: boolean) { + this._setOption('interimResults', value); + } + + @Input() + get lang(): string { + return this._getOption('lang'); + } + set lang(value: string) { + this._setOption('lang', value); + } + + @Input() + get maxAlternatives(): number { + return this._getOption('maxAlternatives'); + } + set maxAlternatives(value: number) { + this._setOption('maxAlternatives', value); + } + + + protected get _optionPath() { + return 'speechRecognitionConfig'; + } + + + constructor(@SkipSelf() @Host() parentOptionHost: NestedOptionHost, + @Host() optionHost: NestedOptionHost) { + super(); + parentOptionHost.setNestedOption(this); + optionHost.setHost(this, this._fullOptionPath.bind(this)); + } + + + ngOnInit() { + this._addRecreatedComponent(); + } + + ngOnDestroy() { + this._addRemovedOption(this._getOptionPath()); + } + + +} + +@NgModule({ + imports: [ + DxoTreeListSpeechRecognitionConfigComponent + ], + exports: [ + DxoTreeListSpeechRecognitionConfigComponent + ], +}) +export class DxoTreeListSpeechRecognitionConfigModule { } diff --git a/packages/devextreme-angular/src/ui/tree-list/nested/speech-to-text-options.ts b/packages/devextreme-angular/src/ui/tree-list/nested/speech-to-text-options.ts new file mode 100644 index 000000000000..1a11d392ad97 --- /dev/null +++ b/packages/devextreme-angular/src/ui/tree-list/nested/speech-to-text-options.ts @@ -0,0 +1,301 @@ +/* tslint:disable:max-line-length */ + + +import { + Component, + OnInit, + OnDestroy, + NgModule, + Host, + SkipSelf, + Input +} from '@angular/core'; + + + + +import type { CustomSpeechRecognizer, ContentReadyEvent, DisposingEvent, EndEvent, ErrorEvent, InitializedEvent, OptionChangedEvent, ResultEvent, StartClickEvent, StopClickEvent, SpeechRecognitionConfig } from 'devextreme/ui/speech_to_text'; +import type { ButtonStyle, ButtonType } from 'devextreme/common'; + +import { + DxIntegrationModule, + NestedOptionHost, +} from 'devextreme-angular/core'; +import { NestedOption } from 'devextreme-angular/core'; + + +@Component({ + selector: 'dxo-tree-list-speech-to-text-options', + standalone: true, + template: '', + styles: [''], + imports: [ DxIntegrationModule ], + providers: [NestedOptionHost] +}) +export class DxoTreeListSpeechToTextOptionsComponent extends NestedOption implements OnDestroy, OnInit { + @Input() + get accessKey(): string | undefined { + return this._getOption('accessKey'); + } + set accessKey(value: string | undefined) { + this._setOption('accessKey', value); + } + + @Input() + get activeStateEnabled(): boolean { + return this._getOption('activeStateEnabled'); + } + set activeStateEnabled(value: boolean) { + this._setOption('activeStateEnabled', value); + } + + @Input() + get customSpeechRecognizer(): CustomSpeechRecognizer { + return this._getOption('customSpeechRecognizer'); + } + set customSpeechRecognizer(value: CustomSpeechRecognizer) { + this._setOption('customSpeechRecognizer', value); + } + + @Input() + get disabled(): boolean { + return this._getOption('disabled'); + } + set disabled(value: boolean) { + this._setOption('disabled', value); + } + + @Input() + get elementAttr(): Record { + return this._getOption('elementAttr'); + } + set elementAttr(value: Record) { + this._setOption('elementAttr', value); + } + + @Input() + get focusStateEnabled(): boolean { + return this._getOption('focusStateEnabled'); + } + set focusStateEnabled(value: boolean) { + this._setOption('focusStateEnabled', value); + } + + @Input() + get height(): number | string | undefined { + return this._getOption('height'); + } + set height(value: number | string | undefined) { + this._setOption('height', value); + } + + @Input() + get hint(): string | undefined { + return this._getOption('hint'); + } + set hint(value: string | undefined) { + this._setOption('hint', value); + } + + @Input() + get hoverStateEnabled(): boolean { + return this._getOption('hoverStateEnabled'); + } + set hoverStateEnabled(value: boolean) { + this._setOption('hoverStateEnabled', value); + } + + @Input() + get onContentReady(): ((e: ContentReadyEvent) => void) { + return this._getOption('onContentReady'); + } + set onContentReady(value: ((e: ContentReadyEvent) => void)) { + this._setOption('onContentReady', value); + } + + @Input() + get onDisposing(): ((e: DisposingEvent) => void) { + return this._getOption('onDisposing'); + } + set onDisposing(value: ((e: DisposingEvent) => void)) { + this._setOption('onDisposing', value); + } + + @Input() + get onEnd(): ((e: EndEvent) => void) | undefined { + return this._getOption('onEnd'); + } + set onEnd(value: ((e: EndEvent) => void) | undefined) { + this._setOption('onEnd', value); + } + + @Input() + get onError(): ((e: ErrorEvent) => void) | undefined { + return this._getOption('onError'); + } + set onError(value: ((e: ErrorEvent) => void) | undefined) { + this._setOption('onError', value); + } + + @Input() + get onInitialized(): ((e: InitializedEvent) => void) { + return this._getOption('onInitialized'); + } + set onInitialized(value: ((e: InitializedEvent) => void)) { + this._setOption('onInitialized', value); + } + + @Input() + get onOptionChanged(): ((e: OptionChangedEvent) => void) { + return this._getOption('onOptionChanged'); + } + set onOptionChanged(value: ((e: OptionChangedEvent) => void)) { + this._setOption('onOptionChanged', value); + } + + @Input() + get onResult(): ((e: ResultEvent) => void) | undefined { + return this._getOption('onResult'); + } + set onResult(value: ((e: ResultEvent) => void) | undefined) { + this._setOption('onResult', value); + } + + @Input() + get onStartClick(): ((e: StartClickEvent) => void) | undefined { + return this._getOption('onStartClick'); + } + set onStartClick(value: ((e: StartClickEvent) => void) | undefined) { + this._setOption('onStartClick', value); + } + + @Input() + get onStopClick(): ((e: StopClickEvent) => void) | undefined { + return this._getOption('onStopClick'); + } + set onStopClick(value: ((e: StopClickEvent) => void) | undefined) { + this._setOption('onStopClick', value); + } + + @Input() + get rtlEnabled(): boolean { + return this._getOption('rtlEnabled'); + } + set rtlEnabled(value: boolean) { + this._setOption('rtlEnabled', value); + } + + @Input() + get speechRecognitionConfig(): Record | SpeechRecognitionConfig { + return this._getOption('speechRecognitionConfig'); + } + set speechRecognitionConfig(value: Record | SpeechRecognitionConfig) { + this._setOption('speechRecognitionConfig', value); + } + + @Input() + get startIcon(): string { + return this._getOption('startIcon'); + } + set startIcon(value: string) { + this._setOption('startIcon', value); + } + + @Input() + get startText(): string { + return this._getOption('startText'); + } + set startText(value: string) { + this._setOption('startText', value); + } + + @Input() + get stopIcon(): string { + return this._getOption('stopIcon'); + } + set stopIcon(value: string) { + this._setOption('stopIcon', value); + } + + @Input() + get stopText(): string { + return this._getOption('stopText'); + } + set stopText(value: string) { + this._setOption('stopText', value); + } + + @Input() + get stylingMode(): ButtonStyle { + return this._getOption('stylingMode'); + } + set stylingMode(value: ButtonStyle) { + this._setOption('stylingMode', value); + } + + @Input() + get tabIndex(): number { + return this._getOption('tabIndex'); + } + set tabIndex(value: number) { + this._setOption('tabIndex', value); + } + + @Input() + get type(): ButtonType | string { + return this._getOption('type'); + } + set type(value: ButtonType | string) { + this._setOption('type', value); + } + + @Input() + get visible(): boolean { + return this._getOption('visible'); + } + set visible(value: boolean) { + this._setOption('visible', value); + } + + @Input() + get width(): number | string | undefined { + return this._getOption('width'); + } + set width(value: number | string | undefined) { + this._setOption('width', value); + } + + + protected get _optionPath() { + return 'speechToTextOptions'; + } + + + constructor(@SkipSelf() @Host() parentOptionHost: NestedOptionHost, + @Host() optionHost: NestedOptionHost) { + super(); + parentOptionHost.setNestedOption(this); + optionHost.setHost(this, this._fullOptionPath.bind(this)); + } + + + ngOnInit() { + this._addRecreatedComponent(); + } + + ngOnDestroy() { + this._addRemovedOption(this._getOptionPath()); + } + + +} + +@NgModule({ + imports: [ + DxoTreeListSpeechToTextOptionsComponent + ], + exports: [ + DxoTreeListSpeechToTextOptionsComponent + ], +}) +export class DxoTreeListSpeechToTextOptionsModule { } diff --git a/packages/devextreme-angular/src/ui/tree-list/nested/editing-texts.ts b/packages/devextreme-angular/src/ui/tree-list/nested/tree-list-editing-texts.ts similarity index 91% rename from packages/devextreme-angular/src/ui/tree-list/nested/editing-texts.ts rename to packages/devextreme-angular/src/ui/tree-list/nested/tree-list-editing-texts.ts index 2def7d73841b..3f9bdde3a3a9 100644 --- a/packages/devextreme-angular/src/ui/tree-list/nested/editing-texts.ts +++ b/packages/devextreme-angular/src/ui/tree-list/nested/tree-list-editing-texts.ts @@ -23,13 +23,14 @@ import { NestedOption } from 'devextreme-angular/core'; @Component({ - selector: 'dxo-tree-list-editing-texts', + selector: 'dxo-tree-list-tree-list-editing-texts', + standalone: true, template: '', styles: [''], imports: [ DxIntegrationModule ], providers: [NestedOptionHost] }) -export class DxoTreeListEditingTextsComponent extends NestedOption implements OnDestroy, OnInit { +export class DxoTreeListTreeListEditingTextsComponent extends NestedOption implements OnDestroy, OnInit { @Input() get addRow(): string { return this._getOption('addRow'); @@ -153,10 +154,10 @@ export class DxoTreeListEditingTextsComponent extends NestedOption implements On @NgModule({ imports: [ - DxoTreeListEditingTextsComponent + DxoTreeListTreeListEditingTextsComponent ], exports: [ - DxoTreeListEditingTextsComponent + DxoTreeListTreeListEditingTextsComponent ], }) -export class DxoTreeListEditingTextsModule { } +export class DxoTreeListTreeListEditingTextsModule { } diff --git a/packages/devextreme-angular/src/ui/tree-list/nested/tree-list-editing.ts b/packages/devextreme-angular/src/ui/tree-list/nested/tree-list-editing.ts new file mode 100644 index 000000000000..27289d38ef9c --- /dev/null +++ b/packages/devextreme-angular/src/ui/tree-list/nested/tree-list-editing.ts @@ -0,0 +1,230 @@ +/* tslint:disable:max-line-length */ + + +import { + Component, + OnInit, + OnDestroy, + NgModule, + Host, + SkipSelf, + Input, + Output, + EventEmitter, + ContentChildren, + QueryList +} from '@angular/core'; + + + + +import type { default as dxTreeList, dxTreeListRowObject } from 'devextreme/ui/tree_list'; +import type { DataChange, GridsEditMode, GridsEditRefreshMode, StartEditAction } from 'devextreme/common/grids'; +import type { dxFormOptions } from 'devextreme/ui/form'; +import type { dxPopupOptions } from 'devextreme/ui/popup'; + +import { + DxIntegrationModule, + NestedOptionHost, + CollectionNestedOption, +} from 'devextreme-angular/core'; +import { NestedOption } from 'devextreme-angular/core'; + +import { + PROPERTY_TOKEN_changes, +} from 'devextreme-angular/core/tokens'; + +@Component({ + selector: 'dxo-tree-list-tree-list-editing', + standalone: true, + template: '', + styles: [''], + imports: [ DxIntegrationModule ], + providers: [NestedOptionHost] +}) +export class DxoTreeListTreeListEditingComponent extends NestedOption implements OnDestroy, OnInit { + @ContentChildren(PROPERTY_TOKEN_changes) + set _changesContentChildren(value: QueryList) { + this.setChildren('changes', value); + } + + @Input() + get allowAdding(): boolean | ((options: { component: dxTreeList, row: dxTreeListRowObject }) => boolean) { + return this._getOption('allowAdding'); + } + set allowAdding(value: boolean | ((options: { component: dxTreeList, row: dxTreeListRowObject }) => boolean)) { + this._setOption('allowAdding', value); + } + + @Input() + get allowDeleting(): boolean | ((options: { component: dxTreeList, row: dxTreeListRowObject }) => boolean) { + return this._getOption('allowDeleting'); + } + set allowDeleting(value: boolean | ((options: { component: dxTreeList, row: dxTreeListRowObject }) => boolean)) { + this._setOption('allowDeleting', value); + } + + @Input() + get allowUpdating(): boolean | ((options: { component: dxTreeList, row: dxTreeListRowObject }) => boolean) { + return this._getOption('allowUpdating'); + } + set allowUpdating(value: boolean | ((options: { component: dxTreeList, row: dxTreeListRowObject }) => boolean)) { + this._setOption('allowUpdating', value); + } + + @Input() + get changes(): Array { + return this._getOption('changes'); + } + set changes(value: Array) { + this._setOption('changes', value); + } + + @Input() + get confirmDelete(): boolean { + return this._getOption('confirmDelete'); + } + set confirmDelete(value: boolean) { + this._setOption('confirmDelete', value); + } + + @Input() + get editColumnName(): string { + return this._getOption('editColumnName'); + } + set editColumnName(value: string) { + this._setOption('editColumnName', value); + } + + @Input() + get editRowKey(): any { + return this._getOption('editRowKey'); + } + set editRowKey(value: any) { + this._setOption('editRowKey', value); + } + + @Input() + get form(): dxFormOptions { + return this._getOption('form'); + } + set form(value: dxFormOptions) { + this._setOption('form', value); + } + + @Input() + get mode(): GridsEditMode { + return this._getOption('mode'); + } + set mode(value: GridsEditMode) { + this._setOption('mode', value); + } + + @Input() + get popup(): dxPopupOptions { + return this._getOption('popup'); + } + set popup(value: dxPopupOptions) { + this._setOption('popup', value); + } + + @Input() + get refreshMode(): GridsEditRefreshMode { + return this._getOption('refreshMode'); + } + set refreshMode(value: GridsEditRefreshMode) { + this._setOption('refreshMode', value); + } + + @Input() + get selectTextOnEditStart(): boolean { + return this._getOption('selectTextOnEditStart'); + } + set selectTextOnEditStart(value: boolean) { + this._setOption('selectTextOnEditStart', value); + } + + @Input() + get startEditAction(): StartEditAction { + return this._getOption('startEditAction'); + } + set startEditAction(value: StartEditAction) { + this._setOption('startEditAction', value); + } + + @Input() + get texts(): { addRow?: string, addRowToNode?: string, cancelAllChanges?: string, cancelRowChanges?: string, confirmDeleteMessage?: string, confirmDeleteTitle?: string, deleteRow?: string, editRow?: string, saveAllChanges?: string, saveRowChanges?: string, undeleteRow?: string, validationCancelChanges?: string } { + return this._getOption('texts'); + } + set texts(value: { addRow?: string, addRowToNode?: string, cancelAllChanges?: string, cancelRowChanges?: string, confirmDeleteMessage?: string, confirmDeleteTitle?: string, deleteRow?: string, editRow?: string, saveAllChanges?: string, saveRowChanges?: string, undeleteRow?: string, validationCancelChanges?: string }) { + this._setOption('texts', value); + } + + @Input() + get useIcons(): boolean { + return this._getOption('useIcons'); + } + set useIcons(value: boolean) { + this._setOption('useIcons', value); + } + + + /** + + * This member supports the internal infrastructure and is not intended to be used directly from your code. + + */ + @Output() changesChange: EventEmitter>; + + /** + + * This member supports the internal infrastructure and is not intended to be used directly from your code. + + */ + @Output() editColumnNameChange: EventEmitter; + + /** + + * This member supports the internal infrastructure and is not intended to be used directly from your code. + + */ + @Output() editRowKeyChange: EventEmitter; + protected get _optionPath() { + return 'editing'; + } + + + constructor(@SkipSelf() @Host() parentOptionHost: NestedOptionHost, + @Host() optionHost: NestedOptionHost) { + super(); + this._createEventEmitters([ + { emit: 'changesChange' }, + { emit: 'editColumnNameChange' }, + { emit: 'editRowKeyChange' } + ]); + + parentOptionHost.setNestedOption(this); + optionHost.setHost(this, this._fullOptionPath.bind(this)); + } + + + ngOnInit() { + this._addRecreatedComponent(); + } + + ngOnDestroy() { + this._addRemovedOption(this._getOptionPath()); + } + + +} + +@NgModule({ + imports: [ + DxoTreeListTreeListEditingComponent + ], + exports: [ + DxoTreeListTreeListEditingComponent + ], +}) +export class DxoTreeListTreeListEditingModule { } diff --git a/packages/devextreme-angular/src/ui/tree-list/nested/typing-user-dxi.ts b/packages/devextreme-angular/src/ui/tree-list/nested/typing-user-dxi.ts new file mode 100644 index 000000000000..d303e71597a2 --- /dev/null +++ b/packages/devextreme-angular/src/ui/tree-list/nested/typing-user-dxi.ts @@ -0,0 +1,100 @@ +/* tslint:disable:max-line-length */ + + +import { + Component, + NgModule, + Host, + SkipSelf, + Input +} from '@angular/core'; + + + + + +import { + DxIntegrationModule, + NestedOptionHost, +} from 'devextreme-angular/core'; +import { CollectionNestedOption } from 'devextreme-angular/core'; + +import { PROPERTY_TOKEN_typingUsers } from 'devextreme-angular/core/tokens'; + +@Component({ + selector: 'dxi-tree-list-typing-user', + standalone: true, + template: '', + styles: [''], + imports: [ DxIntegrationModule ], + providers: [ + NestedOptionHost, + { + provide: PROPERTY_TOKEN_typingUsers, + useExisting: DxiTreeListTypingUserComponent, + } + ] +}) +export class DxiTreeListTypingUserComponent extends CollectionNestedOption { + @Input() + get avatarAlt(): string { + return this._getOption('avatarAlt'); + } + set avatarAlt(value: string) { + this._setOption('avatarAlt', value); + } + + @Input() + get avatarUrl(): string { + return this._getOption('avatarUrl'); + } + set avatarUrl(value: string) { + this._setOption('avatarUrl', value); + } + + @Input() + get id(): number | string { + return this._getOption('id'); + } + set id(value: number | string) { + this._setOption('id', value); + } + + @Input() + get name(): string { + return this._getOption('name'); + } + set name(value: string) { + this._setOption('name', value); + } + + + protected get _optionPath() { + return 'typingUsers'; + } + + + constructor(@SkipSelf() @Host() parentOptionHost: NestedOptionHost, + @Host() optionHost: NestedOptionHost) { + super(); + parentOptionHost.setNestedOption(this); + optionHost.setHost(this, this._fullOptionPath.bind(this)); + } + + + + ngOnDestroy() { + this._deleteRemovedOptions(this._fullOptionPath()); + } + +} + +@NgModule({ + imports: [ + DxiTreeListTypingUserComponent + ], + exports: [ + DxiTreeListTypingUserComponent + ], +}) +export class DxiTreeListTypingUserModule { } diff --git a/packages/devextreme-angular/src/ui/tree-list/nested/user.ts b/packages/devextreme-angular/src/ui/tree-list/nested/user.ts new file mode 100644 index 000000000000..6cadadabdb3e --- /dev/null +++ b/packages/devextreme-angular/src/ui/tree-list/nested/user.ts @@ -0,0 +1,99 @@ +/* tslint:disable:max-line-length */ + + +import { + Component, + OnInit, + OnDestroy, + NgModule, + Host, + SkipSelf, + Input +} from '@angular/core'; + + + + + +import { + DxIntegrationModule, + NestedOptionHost, +} from 'devextreme-angular/core'; +import { NestedOption } from 'devextreme-angular/core'; + + +@Component({ + selector: 'dxo-tree-list-user', + standalone: true, + template: '', + styles: [''], + imports: [ DxIntegrationModule ], + providers: [NestedOptionHost] +}) +export class DxoTreeListUserComponent extends NestedOption implements OnDestroy, OnInit { + @Input() + get avatarAlt(): string { + return this._getOption('avatarAlt'); + } + set avatarAlt(value: string) { + this._setOption('avatarAlt', value); + } + + @Input() + get avatarUrl(): string { + return this._getOption('avatarUrl'); + } + set avatarUrl(value: string) { + this._setOption('avatarUrl', value); + } + + @Input() + get id(): number | string { + return this._getOption('id'); + } + set id(value: number | string) { + this._setOption('id', value); + } + + @Input() + get name(): string { + return this._getOption('name'); + } + set name(value: string) { + this._setOption('name', value); + } + + + protected get _optionPath() { + return 'user'; + } + + + constructor(@SkipSelf() @Host() parentOptionHost: NestedOptionHost, + @Host() optionHost: NestedOptionHost) { + super(); + parentOptionHost.setNestedOption(this); + optionHost.setHost(this, this._fullOptionPath.bind(this)); + } + + + ngOnInit() { + this._addRecreatedComponent(); + } + + ngOnDestroy() { + this._addRemovedOption(this._getOptionPath()); + } + + +} + +@NgModule({ + imports: [ + DxoTreeListUserComponent + ], + exports: [ + DxoTreeListUserComponent + ], +}) +export class DxoTreeListUserModule { } diff --git a/packages/devextreme-metadata/make-angular-metadata.ts b/packages/devextreme-metadata/make-angular-metadata.ts index 42774f532e9f..ae5cbc51f910 100644 --- a/packages/devextreme-metadata/make-angular-metadata.ts +++ b/packages/devextreme-metadata/make-angular-metadata.ts @@ -47,6 +47,7 @@ Ng.makeMetadata({ ...replaceTypesMutations, removeMembers(/\/grids:ColumnBase.ai/), + removeMembers(/\/grids:GridBaseOptions.aiAssistant/), removeMembers(/\/calendar:dxCalendarOptions.todayButtonText/), removeMembers(/\/card_view:/), removeMembers(/\/chat:TextMessage.attachments/), diff --git a/packages/devextreme-react/src/common/grids.ts b/packages/devextreme-react/src/common/grids.ts index 3a2c80da1a00..2cf419615368 100644 --- a/packages/devextreme-react/src/common/grids.ts +++ b/packages/devextreme-react/src/common/grids.ts @@ -1,5 +1,7 @@ export type { AdaptiveDetailRowPreparingInfo, + AIAssistant, + AIAssistantRequestCreatingInfo, AIColumnMode, AIColumnRequestCreatingInfo, ApplyChangesMode, diff --git a/packages/devextreme-react/src/common/index.ts b/packages/devextreme-react/src/common/index.ts index 44eee965a2a0..2986f0bf89c6 100644 --- a/packages/devextreme-react/src/common/index.ts +++ b/packages/devextreme-react/src/common/index.ts @@ -273,6 +273,8 @@ export namespace Export { export function Grids(): void {} export namespace Grids { export type AdaptiveDetailRowPreparingInfo = GridsModule.AdaptiveDetailRowPreparingInfo; + export type AIAssistant = GridsModule.AIAssistant; + export type AIAssistantRequestCreatingInfo = GridsModule.AIAssistantRequestCreatingInfo; export type AIColumnMode = GridsModule.AIColumnMode; export type AIColumnRequestCreatingInfo = GridsModule.AIColumnRequestCreatingInfo; export type ApplyChangesMode = GridsModule.ApplyChangesMode; diff --git a/packages/devextreme-react/src/data-grid.ts b/packages/devextreme-react/src/data-grid.ts index e5efdc3db829..b45bb50c4cd6 100644 --- a/packages/devextreme-react/src/data-grid.ts +++ b/packages/devextreme-react/src/data-grid.ts @@ -9,35 +9,40 @@ import dxDataGrid, { import { Component as BaseComponent, IHtmlOptions, ComponentRef, NestedComponentMeta } from "./core/component"; import NestedOption from "./core/nested-option"; -import type { dxDataGridColumn, AdaptiveDetailRowPreparingEvent, AIColumnRequestCreatingEvent, CellClickEvent, CellDblClickEvent, CellPreparedEvent, ContentReadyEvent, ContextMenuPreparingEvent, DataErrorOccurredEvent, DisposingEvent, EditCanceledEvent, EditCancelingEvent, EditingStartEvent, EditorPreparedEvent, EditorPreparingEvent, ExportingEvent, FocusedCellChangingEvent, FocusedRowChangingEvent, InitializedEvent, InitNewRowEvent, KeyDownEvent, RowClickEvent, RowCollapsedEvent, RowCollapsingEvent, RowDblClickEvent, RowExpandedEvent, RowExpandingEvent, RowInsertedEvent, RowInsertingEvent, RowPreparedEvent, RowRemovedEvent, RowRemovingEvent, RowUpdatedEvent, RowUpdatingEvent, RowValidatingEvent, SavedEvent, SavingEvent, ToolbarPreparingEvent, dxDataGridRowObject, DataGridPredefinedColumnButton, ColumnButtonClickEvent, dxDataGridColumnButton, DataGridCommandColumnType, SelectionSensitivity, DataGridPredefinedToolbarItem, DataGridExportFormat, DataGridScrollMode, dxDataGridToolbarItem } from "devextreme/ui/data_grid"; -import type { DataChange, AIColumnMode, DataChangeType, ColumnAIOptions, FilterOperation, FilterType, FixedPosition, ColumnHeaderFilter as GridsColumnHeaderFilter, SelectedFilterOperation, ColumnChooserMode, ColumnChooserSearchConfig, ColumnChooserSelectionConfig, HeaderFilterGroupInterval, ColumnHeaderFilterSearchConfig, HeaderFilterSearchConfig, HeaderFilterTexts, SelectionColumnDisplayMode, GridsEditMode, NewRowPosition, GridsEditRefreshMode, StartEditAction, FilterPanel as GridsFilterPanel, FilterPanelTexts as GridsFilterPanelTexts, ApplyFilterMode, GroupExpandMode, SummaryType, EnterKeyAction, EnterKeyDirection, PagerPageSize, GridBase, DataRenderMode, StateStoreType } from "devextreme/common/grids"; -import type { Mode, ValidationRuleType, HorizontalAlignment, VerticalAlignment, template, TextEditorButtonLocation, ButtonStyle, ButtonType, DataType, Format as CommonFormat, SortOrder, SearchMode, ComparisonOperator, SingleMultipleOrNone, SelectAllMode, ToolbarItemLocation, ToolbarItemComponent, TextBoxPredefinedButton, TextEditorButton, LabelMode, MaskMode, EditorStyle, ValidationMessageMode, Position as CommonPosition, ValidationStatus, PositionAlignment, Direction, DisplayMode, DragDirection, DragHighlight, ScrollbarMode, TabsIconPosition, TabsStyle } from "devextreme/common"; +import type { dxDataGridColumn, AdaptiveDetailRowPreparingEvent, AIAssistantRequestCreatingEvent, AIColumnRequestCreatingEvent, CellClickEvent, CellDblClickEvent, CellPreparedEvent, ContentReadyEvent, ContextMenuPreparingEvent, DataErrorOccurredEvent, DisposingEvent, EditCanceledEvent, EditCancelingEvent, EditingStartEvent, EditorPreparedEvent, EditorPreparingEvent, ExportingEvent, FocusedCellChangingEvent, FocusedRowChangingEvent, InitializedEvent, InitNewRowEvent, KeyDownEvent, RowClickEvent, RowCollapsedEvent, RowCollapsingEvent, RowDblClickEvent, RowExpandedEvent, RowExpandingEvent, RowInsertedEvent, RowInsertingEvent, RowPreparedEvent, RowRemovedEvent, RowRemovingEvent, RowUpdatedEvent, RowUpdatingEvent, RowValidatingEvent, SavedEvent, SavingEvent, ToolbarPreparingEvent, dxDataGridRowObject, DataGridPredefinedColumnButton, ColumnButtonClickEvent, dxDataGridColumnButton, DataGridCommandColumnType, SelectionSensitivity, DataGridPredefinedToolbarItem, DataGridExportFormat, DataGridScrollMode, dxDataGridToolbarItem } from "devextreme/ui/data_grid"; +import type { DataChange, AIColumnMode, DataChangeType, ColumnAIOptions, FilterOperation, FilterType, FixedPosition, ColumnHeaderFilter as GridsColumnHeaderFilter, SelectedFilterOperation, ColumnChooserMode, ColumnChooserSearchConfig, ColumnChooserSelectionConfig, HeaderFilterGroupInterval, ColumnHeaderFilterSearchConfig, GridsEditMode, NewRowPosition, GridsEditRefreshMode, StartEditAction, HeaderFilterSearchConfig, HeaderFilterTexts, SelectionColumnDisplayMode, FilterPanel as GridsFilterPanel, FilterPanelTexts as GridsFilterPanelTexts, ApplyFilterMode, GroupExpandMode, SummaryType, EnterKeyAction, EnterKeyDirection, PagerPageSize, GridBase, DataRenderMode, StateStoreType } from "devextreme/common/grids"; +import type { Mode, ValidationRuleType, HorizontalAlignment, VerticalAlignment, template, TextEditorButtonLocation, ButtonStyle, ButtonType, Format as CommonFormat, DataType, SortOrder, SearchMode, ComparisonOperator, SingleMultipleOrNone, SelectAllMode, ToolbarItemLocation, ToolbarItemComponent, TextBoxPredefinedButton, TextEditorButton, LabelMode, MaskMode, EditorStyle, ValidationMessageMode, Position as CommonPosition, ValidationStatus, PositionAlignment, Direction, DisplayMode, DragDirection, DragHighlight, ScrollbarMode, TabsIconPosition, TabsStyle } from "devextreme/common"; import type { ContentReadyEvent as ButtonContentReadyEvent, DisposingEvent as ButtonDisposingEvent, InitializedEvent as ButtonInitializedEvent, dxButtonOptions, ClickEvent, OptionChangedEvent } from "devextreme/ui/button"; import type { ContentReadyEvent as TextBoxContentReadyEvent, DisposingEvent as TextBoxDisposingEvent, InitializedEvent as TextBoxInitializedEvent, KeyDownEvent as TextBoxKeyDownEvent, dxTextBoxOptions, OptionChangedEvent as TextBoxOptionChangedEvent, TextBoxType, ChangeEvent, CopyEvent, CutEvent, EnterKeyEvent, FocusInEvent, FocusOutEvent, InputEvent, KeyUpEvent, PasteEvent, ValueChangedEvent } from "devextreme/ui/text_box"; +import type { ContentReadyEvent as FileUploaderContentReadyEvent, DisposingEvent as FileUploaderDisposingEvent, InitializedEvent as FileUploaderInitializedEvent, OptionChangedEvent as FileUploaderOptionChangedEvent, dxFileUploaderOptions, ValueChangedEvent as FileUploaderValueChangedEvent, BeforeSendEvent, DropZoneEnterEvent, DropZoneLeaveEvent, FilesUploadedEvent, ProgressEvent, UploadAbortedEvent, UploadedEvent, UploadErrorEvent, UploadStartedEvent, UploadHttpMethod, FileUploadMode } from "devextreme/ui/file_uploader"; import type { ContentReadyEvent as FilterBuilderContentReadyEvent, DisposingEvent as FilterBuilderDisposingEvent, EditorPreparedEvent as FilterBuilderEditorPreparedEvent, EditorPreparingEvent as FilterBuilderEditorPreparingEvent, InitializedEvent as FilterBuilderInitializedEvent, OptionChangedEvent as FilterBuilderOptionChangedEvent, dxFilterBuilderField, FieldInfo, ValueChangedEvent as FilterBuilderValueChangedEvent, FilterBuilderOperation, dxFilterBuilderCustomOperation, GroupOperation } from "devextreme/ui/filter_builder"; import type { ContentReadyEvent as FormContentReadyEvent, DisposingEvent as FormDisposingEvent, InitializedEvent as FormInitializedEvent, FormItemType, FormPredefinedButtonItem, OptionChangedEvent as FormOptionChangedEvent, dxFormSimpleItem, dxFormOptions, dxFormGroupItem, dxFormTabbedItem, dxFormEmptyItem, dxFormButtonItem, LabelLocation, FormLabelMode, EditorEnterKeyEvent, FieldDataChangedEvent, SmartPastedEvent, SmartPastingEvent, FormItemComponent } from "devextreme/ui/form"; +import type { ContentReadyEvent as SpeechToTextContentReadyEvent, DisposingEvent as SpeechToTextDisposingEvent, InitializedEvent as SpeechToTextInitializedEvent, OptionChangedEvent as SpeechToTextOptionChangedEvent, dxSpeechToTextOptions, CustomSpeechRecognizer as SpeechToTextCustomSpeechRecognizer, EndEvent, ErrorEvent, ResultEvent, StartClickEvent, StopClickEvent, SpeechRecognitionConfig as SpeechToTextSpeechRecognitionConfig } from "devextreme/ui/speech_to_text"; import type { ContentReadyEvent as TabPanelContentReadyEvent, DisposingEvent as TabPanelDisposingEvent, InitializedEvent as TabPanelInitializedEvent, OptionChangedEvent as TabPanelOptionChangedEvent, dxTabPanelOptions, dxTabPanelItem, ItemClickEvent, ItemContextMenuEvent, ItemHoldEvent, ItemRenderedEvent, SelectionChangedEvent, SelectionChangingEvent, TitleClickEvent, TitleHoldEvent, TitleRenderedEvent } from "devextreme/ui/tab_panel"; +import type { DisposingEvent as ChatDisposingEvent, InitializedEvent as ChatInitializedEvent, dxChatOptions, OptionChangedEvent as ChatOptionChangedEvent, Alert as ChatAlert, Message, AttachmentDownloadClickEvent, InputFieldTextChangedEvent, MessageDeletedEvent, MessageDeletingEvent, MessageEditCanceledEvent, MessageEditingStartEvent, MessageEnteredEvent, MessageUpdatedEvent, MessageUpdatingEvent, TypingEndEvent, TypingStartEvent, SendButtonProperties, User as ChatUser, Attachment as ChatAttachment, SendButtonAction, SendButtonClickEvent } from "devextreme/ui/chat"; import type { AIIntegration } from "devextreme/common/ai-integration"; +import type { dxPopupOptions, dxPopupToolbarItem, ToolbarLocation } from "devextreme/ui/popup"; import type { AnimationConfig, CollisionResolution, PositionConfig, AnimationState, AnimationType, CollisionResolutionCombination } from "devextreme/common/core/animation"; -import type { Format as LocalizationFormat } from "devextreme/common/core/localization"; import type { DataSourceOptions } from "devextreme/data/data_source"; import type { Store } from "devextreme/data/store"; +import type { Format as LocalizationFormat } from "devextreme/common/core/localization"; import type { LocateInMenuMode, ShowTextMode } from "devextreme/ui/toolbar"; import type { CollectionWidgetItem } from "devextreme/ui/collection/ui.collection_widget.base"; -import type { dxPopupOptions, dxPopupToolbarItem, ToolbarLocation } from "devextreme/ui/popup"; import type { event } from "devextreme/events/events.types"; import type { EventInfo } from "devextreme/common/core/events"; import type { Component } from "devextreme/core/component"; import type { LoadingAnimationType } from "devextreme/ui/load_indicator"; import type { LoadPanelIndicatorProperties } from "devextreme/ui/load_panel"; +import type DataSource from "devextreme/data/data_source"; +import type dxChat from "devextreme/ui/chat"; +import type UploadInfo from "devextreme/file_management/upload_info"; import type dxOverlay from "devextreme/ui/overlay"; import type DOMComponent from "devextreme/core/dom_component"; import type dxPopup from "devextreme/ui/popup"; import type dxForm from "devextreme/ui/form"; import type dxSortable from "devextreme/ui/sortable"; import type dxDraggable from "devextreme/ui/draggable"; -import type DataSource from "devextreme/data/data_source"; import type * as CommonTypes from "devextreme/common"; @@ -47,6 +52,7 @@ type ReplaceFieldTypes = { type IDataGridOptionsNarrowedEvents = { onAdaptiveDetailRowPreparing?: ((e: AdaptiveDetailRowPreparingEvent) => void); + onAIAssistantRequestCreating?: ((e: AIAssistantRequestCreatingEvent) => void); onAIColumnRequestCreating?: ((e: AIColumnRequestCreatingEvent) => void); onCellClick?: ((e: CellClickEvent) => void); onCellDblClick?: ((e: CellDblClickEvent) => void); @@ -130,8 +136,8 @@ const DataGrid = memo( } ), []); - const subscribableOptions = useMemo(() => (["columns","editing","editing.changes","editing.editColumnName","editing.editRowKey","filterValue","focusedColumnIndex","focusedRowIndex","focusedRowKey","groupPanel","groupPanel.visible","paging","paging.pageIndex","paging.pageSize","selectedRowKeys","selectionFilter","filterBuilder.value","filterBuilderPopup.height","filterBuilderPopup.position","filterBuilderPopup.visible","filterBuilderPopup.width","filterPanel.filterEnabled","editing.form.formData","editing.popup.height","editing.popup.position","editing.popup.visible","editing.popup.width","searchPanel.text"]), []); - const independentEvents = useMemo(() => (["onAdaptiveDetailRowPreparing","onAIColumnRequestCreating","onCellClick","onCellDblClick","onCellPrepared","onContentReady","onContextMenuPreparing","onDataErrorOccurred","onDisposing","onEditCanceled","onEditCanceling","onEditingStart","onEditorPrepared","onEditorPreparing","onExporting","onFocusedCellChanging","onFocusedRowChanging","onInitialized","onInitNewRow","onKeyDown","onRowClick","onRowCollapsed","onRowCollapsing","onRowDblClick","onRowExpanded","onRowExpanding","onRowInserted","onRowInserting","onRowPrepared","onRowRemoved","onRowRemoving","onRowUpdated","onRowUpdating","onRowValidating","onSaved","onSaving","onToolbarPreparing"]), []); + const subscribableOptions = useMemo(() => (["columns","editing","editing.changes","editing.editColumnName","editing.editRowKey","filterValue","focusedColumnIndex","focusedRowIndex","focusedRowKey","groupPanel","groupPanel.visible","paging","paging.pageIndex","paging.pageSize","selectedRowKeys","selectionFilter","aIAssistant.chat.items","chat.editing.changes","chat.editing.editColumnName","chat.editing.editRowKey","filterBuilder.value","filterBuilderPopup.height","filterBuilderPopup.position","filterBuilderPopup.visible","filterBuilderPopup.width","filterPanel.filterEnabled","dataGridEditing.form.formData","dataGridEditing.popup.height","aIAssistant.popup.height","dataGridEditing.popup.position","aIAssistant.popup.position","dataGridEditing.popup.visible","aIAssistant.popup.visible","dataGridEditing.popup.width","aIAssistant.popup.width","searchPanel.text"]), []); + const independentEvents = useMemo(() => (["onAdaptiveDetailRowPreparing","onAIAssistantRequestCreating","onAIColumnRequestCreating","onCellClick","onCellDblClick","onCellPrepared","onContentReady","onContextMenuPreparing","onDataErrorOccurred","onDisposing","onEditCanceled","onEditCanceling","onEditingStart","onEditorPrepared","onEditorPreparing","onExporting","onFocusedCellChanging","onFocusedRowChanging","onInitialized","onInitNewRow","onKeyDown","onRowClick","onRowCollapsed","onRowCollapsing","onRowDblClick","onRowExpanded","onRowExpanding","onRowInserted","onRowInserting","onRowPrepared","onRowRemoved","onRowRemoving","onRowUpdated","onRowUpdating","onRowValidating","onSaved","onSaving","onToolbarPreparing"]), []); const defaults = useMemo(() => ({ defaultColumns: "columns", @@ -147,9 +153,11 @@ const DataGrid = memo( }), []); const expectedChildren = useMemo(() => ({ + aiAssistant: { optionName: "aiAssistant", isCollectionItem: false }, column: { optionName: "columns", isCollectionItem: true }, columnChooser: { optionName: "columnChooser", isCollectionItem: false }, columnFixing: { optionName: "columnFixing", isCollectionItem: false }, + dataGridEditing: { optionName: "editing", isCollectionItem: false }, dataGridHeaderFilter: { optionName: "headerFilter", isCollectionItem: false }, dataGridSelection: { optionName: "selection", isCollectionItem: false }, editing: { optionName: "editing", isCollectionItem: false }, @@ -237,6 +245,32 @@ const AI = Object.assign(_componentAI, componentType: "option", }); +// owners: +// DataGrid +type IAIAssistantProps = React.PropsWithChildren<{ + aiIntegration?: AIIntegration; + chat?: dxChatOptions; + enabled?: boolean; + popup?: dxPopupOptions; + title?: string; +}> +const _componentAIAssistant = (props: IAIAssistantProps) => { + return React.createElement(NestedOption, { + ...props, + elementDescriptor: { + OptionName: "aiAssistant", + ExpectedChildren: { + chat: { optionName: "chat", isCollectionItem: false }, + popup: { optionName: "popup", isCollectionItem: false } + }, + }, + }); +}; + +const AIAssistant = Object.assign(_componentAIAssistant, { + componentType: "option", +}); + // owners: // FormItem // SimpleItem @@ -257,6 +291,26 @@ const AIOptions = Object.assign componentType: "option", }); +// owners: +// Chat +type IAlertProps = React.PropsWithChildren<{ + id?: number | string; + message?: string; +}> +const _componentAlert = (props: IAlertProps) => { + return React.createElement(NestedOption, { + ...props, + elementDescriptor: { + OptionName: "alerts", + IsCollectionItem: true, + }, + }); +}; + +const Alert = Object.assign(_componentAlert, { + componentType: "option", +}); + // owners: // Popup // FilterBuilderPopup @@ -328,6 +382,47 @@ const At = Object.assign(_componentAt, componentType: "option", }); +// owners: +// ChatItem +type IAttachmentProps = React.PropsWithChildren<{ + name?: string; + size?: number; +}> +const _componentAttachment = (props: IAttachmentProps) => { + return React.createElement(NestedOption, { + ...props, + elementDescriptor: { + OptionName: "attachments", + IsCollectionItem: true, + }, + }); +}; + +const Attachment = Object.assign(_componentAttachment, { + componentType: "option", +}); + +// owners: +// ChatItem +type IAuthorProps = React.PropsWithChildren<{ + avatarAlt?: string; + avatarUrl?: string; + id?: number | string; + name?: string; +}> +const _componentAuthor = (props: IAuthorProps) => { + return React.createElement(NestedOption, { + ...props, + elementDescriptor: { + OptionName: "author", + }, + }); +}; + +const Author = Object.assign(_componentAuthor, { + componentType: "option", +}); + // owners: // Position type IBoundaryOffsetProps = React.PropsWithChildren<{ @@ -469,7 +564,7 @@ const ButtonOptions = Object.assign(_comp componentType: "option", }); +// owners: +// AIAssistant +type IChatProps = React.PropsWithChildren<{ + accessKey?: string | undefined; + activeStateEnabled?: boolean; + alerts?: Array; + dataSource?: Array | DataSource | DataSourceOptions | null | Store | string; + dayHeaderFormat?: LocalizationFormat; + disabled?: boolean; + editing?: Record | { + allowDeleting?: boolean | ((options: { component: dxChat, message: Message }) => boolean); + allowUpdating?: boolean | ((options: { component: dxChat, message: Message }) => boolean); + }; + elementAttr?: Record; + emptyViewTemplate?: ((data: { component: dxChat, texts: Record }, itemElement: any) => string | any) | null | template; + fileUploaderOptions?: dxFileUploaderOptions; + focusStateEnabled?: boolean; + height?: number | string | undefined; + hint?: string | undefined; + hoverStateEnabled?: boolean; + inputFieldText?: string | undefined; + items?: Array; + messageTemplate?: ((data: { component: dxChat, message: Message }, messageBubbleElement: any) => string | any) | null | template; + messageTimestampFormat?: LocalizationFormat; + onAttachmentDownloadClick?: ((e: AttachmentDownloadClickEvent) => void) | undefined; + onDisposing?: ((e: ChatDisposingEvent) => void); + onInitialized?: ((e: ChatInitializedEvent) => void); + onInputFieldTextChanged?: ((e: InputFieldTextChangedEvent) => void) | undefined; + onMessageDeleted?: ((e: MessageDeletedEvent) => void) | undefined; + onMessageDeleting?: ((e: MessageDeletingEvent) => void) | undefined; + onMessageEditCanceled?: ((e: MessageEditCanceledEvent) => void) | undefined; + onMessageEditingStart?: ((e: MessageEditingStartEvent) => void) | undefined; + onMessageEntered?: ((e: MessageEnteredEvent) => void) | undefined; + onMessageUpdated?: ((e: MessageUpdatedEvent) => void) | undefined; + onMessageUpdating?: ((e: MessageUpdatingEvent) => void) | undefined; + onOptionChanged?: ((e: ChatOptionChangedEvent) => void); + onTypingEnd?: ((e: TypingEndEvent) => void) | undefined; + onTypingStart?: ((e: TypingStartEvent) => void) | undefined; + reloadOnChange?: boolean; + rtlEnabled?: boolean; + sendButtonOptions?: SendButtonProperties; + showAvatar?: boolean; + showDayHeaders?: boolean; + showMessageTimestamp?: boolean; + showUserName?: boolean; + speechToTextEnabled?: boolean; + speechToTextOptions?: dxSpeechToTextOptions; + typingUsers?: Array; + user?: ChatUser; + visible?: boolean; + width?: number | string | undefined; + defaultItems?: Array; + onItemsChange?: (value: Array) => void; + emptyViewRender?: (...params: any) => React.ReactNode; + emptyViewComponent?: React.ComponentType; + messageRender?: (...params: any) => React.ReactNode; + messageComponent?: React.ComponentType; +}> +const _componentChat = (props: IChatProps) => { + return React.createElement(NestedOption, { + ...props, + elementDescriptor: { + OptionName: "chat", + DefaultsProps: { + defaultItems: "items" + }, + ExpectedChildren: { + alert: { optionName: "alerts", isCollectionItem: true }, + chatEditing: { optionName: "editing", isCollectionItem: false }, + chatItem: { optionName: "items", isCollectionItem: true }, + dayHeaderFormat: { optionName: "dayHeaderFormat", isCollectionItem: false }, + editing: { optionName: "editing", isCollectionItem: false }, + fileUploaderOptions: { optionName: "fileUploaderOptions", isCollectionItem: false }, + item: { optionName: "items", isCollectionItem: true }, + messageTimestampFormat: { optionName: "messageTimestampFormat", isCollectionItem: false }, + sendButtonOptions: { optionName: "sendButtonOptions", isCollectionItem: false }, + speechToTextOptions: { optionName: "speechToTextOptions", isCollectionItem: false }, + typingUser: { optionName: "typingUsers", isCollectionItem: true }, + user: { optionName: "user", isCollectionItem: false } + }, + TemplateProps: [{ + tmplOption: "emptyViewTemplate", + render: "emptyViewRender", + component: "emptyViewComponent" + }, { + tmplOption: "messageTemplate", + render: "messageRender", + component: "messageComponent" + }], + }, + }); +}; + +const Chat = Object.assign(_componentChat, { + componentType: "option", +}); + +// owners: +// Chat +type IChatEditingProps = React.PropsWithChildren<{ + allowDeleting?: boolean | ((options: { component: dxChat, message: Message }) => boolean); + allowUpdating?: boolean | ((options: { component: dxChat, message: Message }) => boolean); +}> +const _componentChatEditing = (props: IChatEditingProps) => { + return React.createElement(NestedOption, { + ...props, + elementDescriptor: { + OptionName: "editing", + }, + }); +}; + +const ChatEditing = Object.assign(_componentChatEditing, { + componentType: "option", +}); + +// owners: +// Chat +type IChatItemProps = React.PropsWithChildren<{ + alt?: string; + attachments?: Array; + author?: ChatUser; + id?: number | string; + isDeleted?: boolean; + isEdited?: boolean; + src?: string; + text?: string; + timestamp?: Date | number | string; + type?: string | undefined; +}> +const _componentChatItem = (props: IChatItemProps) => { + return React.createElement(NestedOption, { + ...props, + elementDescriptor: { + OptionName: "items", + IsCollectionItem: true, + ExpectedChildren: { + attachment: { optionName: "attachments", isCollectionItem: true }, + author: { optionName: "author", isCollectionItem: false } + }, + }, + }); +}; + +const ChatItem = Object.assign(_componentChatItem, { + componentType: "option", +}); + // owners: // Form // FormGroupItem @@ -1044,6 +1287,116 @@ const CustomRule = Object.assign +const _componentCustomSpeechRecognizer = (props: ICustomSpeechRecognizerProps) => { + return React.createElement(NestedOption, { + ...props, + elementDescriptor: { + OptionName: "customSpeechRecognizer", + }, + }); +}; + +const CustomSpeechRecognizer = Object.assign(_componentCustomSpeechRecognizer, { + componentType: "option", +}); + +// owners: +// DataGrid +type IDataGridEditingProps = React.PropsWithChildren<{ + allowAdding?: boolean; + allowDeleting?: boolean | ((options: { component: dxDataGrid, row: dxDataGridRowObject }) => boolean); + allowUpdating?: boolean | ((options: { component: dxDataGrid, row: dxDataGridRowObject }) => boolean); + changes?: Array; + confirmDelete?: boolean; + editColumnName?: string; + editRowKey?: any; + form?: dxFormOptions; + mode?: GridsEditMode; + newRowPosition?: NewRowPosition; + popup?: dxPopupOptions; + refreshMode?: GridsEditRefreshMode; + selectTextOnEditStart?: boolean; + startEditAction?: StartEditAction; + texts?: any | { + addRow?: string; + cancelAllChanges?: string; + cancelRowChanges?: string; + confirmDeleteMessage?: string; + confirmDeleteTitle?: string; + deleteRow?: string; + editRow?: string; + saveAllChanges?: string; + saveRowChanges?: string; + undeleteRow?: string; + validationCancelChanges?: string; + }; + useIcons?: boolean; + defaultChanges?: Array; + onChangesChange?: (value: Array) => void; + defaultEditColumnName?: string; + onEditColumnNameChange?: (value: string) => void; + defaultEditRowKey?: any; + onEditRowKeyChange?: (value: any) => void; +}> +const _componentDataGridEditing = (props: IDataGridEditingProps) => { + return React.createElement(NestedOption, { + ...props, + elementDescriptor: { + OptionName: "editing", + DefaultsProps: { + defaultChanges: "changes", + defaultEditColumnName: "editColumnName", + defaultEditRowKey: "editRowKey" + }, + ExpectedChildren: { + change: { optionName: "changes", isCollectionItem: true }, + dataGridEditingTexts: { optionName: "texts", isCollectionItem: false }, + form: { optionName: "form", isCollectionItem: false }, + popup: { optionName: "popup", isCollectionItem: false }, + texts: { optionName: "texts", isCollectionItem: false } + }, + }, + }); +}; + +const DataGridEditing = Object.assign(_componentDataGridEditing, { + componentType: "option", +}); + +// owners: +// DataGridEditing +type IDataGridEditingTextsProps = React.PropsWithChildren<{ + addRow?: string; + cancelAllChanges?: string; + cancelRowChanges?: string; + confirmDeleteMessage?: string; + confirmDeleteTitle?: string; + deleteRow?: string; + editRow?: string; + saveAllChanges?: string; + saveRowChanges?: string; + undeleteRow?: string; + validationCancelChanges?: string; +}> +const _componentDataGridEditingTexts = (props: IDataGridEditingTextsProps) => { + return React.createElement(NestedOption, { + ...props, + elementDescriptor: { + OptionName: "texts", + }, + }); +}; + +const DataGridEditingTexts = Object.assign(_componentDataGridEditingTexts, { + componentType: "option", +}); + // owners: // DataGrid type IDataGridHeaderFilterProps = React.PropsWithChildren<{ @@ -1183,8 +1536,32 @@ const DataGridToolbarItem = Object.assign string); + parser?: ((value: string) => number | Date); + precision?: number; + type?: CommonFormat | string; + useCurrencyAccountingStyle?: boolean; +}> +const _componentDayHeaderFormat = (props: IDayHeaderFormatProps) => { + return React.createElement(NestedOption, { + ...props, + elementDescriptor: { + OptionName: "dayHeaderFormat", + }, + }); +}; + +const DayHeaderFormat = Object.assign(_componentDayHeaderFormat, { + componentType: "option", +}); + // owners: // DataGrid +// Chat type IEditingProps = React.PropsWithChildren<{ allowAdding?: boolean; allowDeleting?: boolean | ((options: { component: dxDataGrid, row: dxDataGridRowObject }) => boolean); @@ -1233,10 +1610,9 @@ const _componentEditing = (props: IEditingProps) => { }, ExpectedChildren: { change: { optionName: "changes", isCollectionItem: true }, - editingTexts: { optionName: "texts", isCollectionItem: false }, + dataGridEditingTexts: { optionName: "texts", isCollectionItem: false }, form: { optionName: "form", isCollectionItem: false }, - popup: { optionName: "popup", isCollectionItem: false }, - texts: { optionName: "texts", isCollectionItem: false } + popup: { optionName: "popup", isCollectionItem: false } }, }, }); @@ -1246,34 +1622,6 @@ const Editing = Object.assign(_co componentType: "option", }); -// owners: -// Editing -type IEditingTextsProps = React.PropsWithChildren<{ - addRow?: string; - cancelAllChanges?: string; - cancelRowChanges?: string; - confirmDeleteMessage?: string; - confirmDeleteTitle?: string; - deleteRow?: string; - editRow?: string; - saveAllChanges?: string; - saveRowChanges?: string; - undeleteRow?: string; - validationCancelChanges?: string; -}> -const _componentEditingTexts = (props: IEditingTextsProps) => { - return React.createElement(NestedOption, { - ...props, - elementDescriptor: { - OptionName: "texts", - }, - }); -}; - -const EditingTexts = Object.assign(_componentEditingTexts, { - componentType: "option", -}); - // owners: // AI type IEditorOptionsProps = React.PropsWithChildren<{ @@ -1550,6 +1898,92 @@ const FieldLookup = Object.assign any); + accept?: string; + accessKey?: string | undefined; + activeStateEnabled?: boolean; + allowCanceling?: boolean; + allowedFileExtensions?: Array; + chunkSize?: number; + dialogTrigger?: any | string | undefined; + disabled?: boolean; + dropZone?: any | string | undefined; + elementAttr?: Record; + focusStateEnabled?: boolean; + height?: number | string | undefined; + hint?: string | undefined; + hoverStateEnabled?: boolean; + inputAttr?: any; + invalidFileExtensionMessage?: string; + invalidMaxFileSizeMessage?: string; + invalidMinFileSizeMessage?: string; + isDirty?: boolean; + isValid?: boolean; + labelText?: string; + maxFileSize?: number; + minFileSize?: number; + multiple?: boolean; + name?: string; + onBeforeSend?: ((e: BeforeSendEvent) => void); + onContentReady?: ((e: FileUploaderContentReadyEvent) => void); + onDisposing?: ((e: FileUploaderDisposingEvent) => void); + onDropZoneEnter?: ((e: DropZoneEnterEvent) => void); + onDropZoneLeave?: ((e: DropZoneLeaveEvent) => void); + onFilesUploaded?: ((e: FilesUploadedEvent) => void); + onInitialized?: ((e: FileUploaderInitializedEvent) => void); + onOptionChanged?: ((e: FileUploaderOptionChangedEvent) => void); + onProgress?: ((e: ProgressEvent) => void); + onUploadAborted?: ((e: UploadAbortedEvent) => void); + onUploaded?: ((e: UploadedEvent) => void); + onUploadError?: ((e: UploadErrorEvent) => void); + onUploadStarted?: ((e: UploadStartedEvent) => void); + onValueChanged?: ((e: FileUploaderValueChangedEvent) => void); + progress?: number; + readOnly?: boolean; + readyToUploadMessage?: string; + rtlEnabled?: boolean; + selectButtonText?: string; + showFileList?: boolean; + tabIndex?: number; + uploadAbortedMessage?: string; + uploadButtonText?: string; + uploadChunk?: ((file: any, uploadInfo: UploadInfo) => any); + uploadCustomData?: any; + uploadedMessage?: string; + uploadFailedMessage?: string; + uploadFile?: ((file: any, progressCallback: (() => void)) => any); + uploadHeaders?: any; + uploadMethod?: UploadHttpMethod; + uploadMode?: FileUploadMode; + uploadUrl?: string; + validationError?: any; + validationErrors?: Array; + validationStatus?: ValidationStatus; + value?: Array; + visible?: boolean; + width?: number | string | undefined; + defaultValue?: Array; + onValueChange?: (value: Array) => void; +}> +const _componentFileUploaderOptions = (props: IFileUploaderOptionsProps) => { + return React.createElement(NestedOption, { + ...props, + elementDescriptor: { + OptionName: "fileUploaderOptions", + DefaultsProps: { + defaultValue: "value" + }, + }, + }); +}; + +const FileUploaderOptions = Object.assign(_componentFileUploaderOptions, { + componentType: "option", +}); + // owners: // DataGrid type IFilterBuilderProps = React.PropsWithChildren<{ @@ -1847,7 +2281,7 @@ const FilterRow = Object.assign }); // owners: -// Editing +// DataGridEditing type IFormProps = React.PropsWithChildren<{ accessKey?: string | undefined; activeStateEnabled?: boolean; @@ -2336,6 +2770,7 @@ const IndicatorOptions = Object.assign; + author?: ChatUser; + id?: number | string; + isDeleted?: boolean; + isEdited?: boolean; + src?: string; + timestamp?: Date | number | string; + type?: string | undefined; tabRender?: (...params: any) => React.ReactNode; tabComponent?: React.ComponentType; render?: (...params: any) => React.ReactNode; @@ -2425,6 +2869,8 @@ const _componentItem = (props: IItemProps) => { ExpectedChildren: { aiOptions: { optionName: "aiOptions", isCollectionItem: false }, AsyncRule: { optionName: "validationRules", isCollectionItem: true }, + attachment: { optionName: "attachments", isCollectionItem: true }, + author: { optionName: "author", isCollectionItem: false }, buttonOptions: { optionName: "buttonOptions", isCollectionItem: false }, colCountByScreen: { optionName: "colCountByScreen", isCollectionItem: false }, CompareRule: { optionName: "validationRules", isCollectionItem: true }, @@ -2597,6 +3043,29 @@ const MasterDetail = Object.assign string); + parser?: ((value: string) => number | Date); + precision?: number; + type?: CommonFormat | string; + useCurrencyAccountingStyle?: boolean; +}> +const _componentMessageTimestampFormat = (props: IMessageTimestampFormatProps) => { + return React.createElement(NestedOption, { + ...props, + elementDescriptor: { + OptionName: "messageTimestampFormat", + }, + }); +}; + +const MessageTimestampFormat = Object.assign(_componentMessageTimestampFormat, { + componentType: "option", +}); + // owners: // Position type IMyProps = React.PropsWithChildren<{ @@ -2818,7 +3287,8 @@ const PatternRule = Object.assign | { @@ -3204,6 +3674,26 @@ const Selection = Object.assign componentType: "option", }); +// owners: +// Chat +type ISendButtonOptionsProps = React.PropsWithChildren<{ + action?: SendButtonAction; + icon?: string; + onClick?: ((e: SendButtonClickEvent) => void); +}> +const _componentSendButtonOptions = (props: ISendButtonOptionsProps) => { + return React.createElement(NestedOption, { + ...props, + elementDescriptor: { + OptionName: "sendButtonOptions", + }, + }); +}; + +const SendButtonOptions = Object.assign(_componentSendButtonOptions, { + componentType: "option", +}); + // owners: // Animation type IShowProps = React.PropsWithChildren<{ @@ -3345,6 +3835,78 @@ const Sorting = Object.assign(_co componentType: "option", }); +// owners: +// SpeechToTextOptions +type ISpeechRecognitionConfigProps = React.PropsWithChildren<{ + continuous?: boolean; + grammars?: Array; + interimResults?: boolean; + lang?: string; + maxAlternatives?: number; +}> +const _componentSpeechRecognitionConfig = (props: ISpeechRecognitionConfigProps) => { + return React.createElement(NestedOption, { + ...props, + elementDescriptor: { + OptionName: "speechRecognitionConfig", + }, + }); +}; + +const SpeechRecognitionConfig = Object.assign(_componentSpeechRecognitionConfig, { + componentType: "option", +}); + +// owners: +// Chat +type ISpeechToTextOptionsProps = React.PropsWithChildren<{ + accessKey?: string | undefined; + activeStateEnabled?: boolean; + customSpeechRecognizer?: SpeechToTextCustomSpeechRecognizer; + disabled?: boolean; + elementAttr?: Record; + focusStateEnabled?: boolean; + height?: number | string | undefined; + hint?: string | undefined; + hoverStateEnabled?: boolean; + onContentReady?: ((e: SpeechToTextContentReadyEvent) => void); + onDisposing?: ((e: SpeechToTextDisposingEvent) => void); + onEnd?: ((e: EndEvent) => void) | undefined; + onError?: ((e: ErrorEvent) => void) | undefined; + onInitialized?: ((e: SpeechToTextInitializedEvent) => void); + onOptionChanged?: ((e: SpeechToTextOptionChangedEvent) => void); + onResult?: ((e: ResultEvent) => void) | undefined; + onStartClick?: ((e: StartClickEvent) => void) | undefined; + onStopClick?: ((e: StopClickEvent) => void) | undefined; + rtlEnabled?: boolean; + speechRecognitionConfig?: Record | SpeechToTextSpeechRecognitionConfig; + startIcon?: string; + startText?: string; + stopIcon?: string; + stopText?: string; + stylingMode?: ButtonStyle; + tabIndex?: number; + type?: ButtonType | string; + visible?: boolean; + width?: number | string | undefined; +}> +const _componentSpeechToTextOptions = (props: ISpeechToTextOptionsProps) => { + return React.createElement(NestedOption, { + ...props, + elementDescriptor: { + OptionName: "speechToTextOptions", + ExpectedChildren: { + customSpeechRecognizer: { optionName: "customSpeechRecognizer", isCollectionItem: false }, + speechRecognitionConfig: { optionName: "speechRecognitionConfig", isCollectionItem: false } + }, + }, + }); +}; + +const SpeechToTextOptions = Object.assign(_componentSpeechToTextOptions, { + componentType: "option", +}); + // owners: // DataGrid type IStateStoringProps = React.PropsWithChildren<{ @@ -3713,7 +4275,7 @@ const TabPanelOptionsItem = Object.assign componentType: "option", }); +// owners: +// Chat +type ITypingUserProps = React.PropsWithChildren<{ + avatarAlt?: string; + avatarUrl?: string; + id?: number | string; + name?: string; +}> +const _componentTypingUser = (props: ITypingUserProps) => { + return React.createElement(NestedOption, { + ...props, + elementDescriptor: { + OptionName: "typingUsers", + IsCollectionItem: true, + }, + }); +}; + +const TypingUser = Object.assign(_componentTypingUser, { + componentType: "option", +}); + +// owners: +// Chat +type IUserProps = React.PropsWithChildren<{ + avatarAlt?: string; + avatarUrl?: string; + id?: number | string; + name?: string; +}> +const _componentUser = (props: IUserProps) => { + return React.createElement(NestedOption, { + ...props, + elementDescriptor: { + OptionName: "user", + }, + }); +}; + +const User = Object.assign(_componentUser, { + componentType: "option", +}); + // owners: // FormItem // Column @@ -3965,14 +4570,22 @@ export { DataGridRef, AI, IAIProps, + AIAssistant, + IAIAssistantProps, AIOptions, IAIOptionsProps, + Alert, + IAlertProps, Animation, IAnimationProps, AsyncRule, IAsyncRuleProps, At, IAtProps, + Attachment, + IAttachmentProps, + Author, + IAuthorProps, BoundaryOffset, IBoundaryOffsetProps, Button, @@ -3983,6 +4596,12 @@ export { IButtonOptionsProps, Change, IChangeProps, + Chat, + IChatProps, + ChatEditing, + IChatEditingProps, + ChatItem, + IChatItemProps, ColCountByScreen, IColCountByScreenProps, Collision, @@ -4015,6 +4634,12 @@ export { ICustomOperationProps, CustomRule, ICustomRuleProps, + CustomSpeechRecognizer, + ICustomSpeechRecognizerProps, + DataGridEditing, + IDataGridEditingProps, + DataGridEditingTexts, + IDataGridEditingTextsProps, DataGridHeaderFilter, IDataGridHeaderFilterProps, DataGridHeaderFilterSearch, @@ -4025,10 +4650,10 @@ export { IDataGridSelectionProps, DataGridToolbarItem, IDataGridToolbarItemProps, + DayHeaderFormat, + IDayHeaderFormatProps, Editing, IEditingProps, - EditingTexts, - IEditingTextsProps, EditorOptions, IEditorOptionsProps, EditorOptionsButton, @@ -4045,6 +4670,8 @@ export { IFieldProps, FieldLookup, IFieldLookupProps, + FileUploaderOptions, + IFileUploaderOptionsProps, FilterBuilder, IFilterBuilderProps, FilterBuilderPopup, @@ -4097,6 +4724,8 @@ export { ILookupProps, MasterDetail, IMasterDetailProps, + MessageTimestampFormat, + IMessageTimestampFormatProps, My, IMyProps, NumericRule, @@ -4133,6 +4762,8 @@ export { ISearchPanelProps, Selection, ISelectionProps, + SendButtonOptions, + ISendButtonOptionsProps, Show, IShowProps, SimpleItem, @@ -4141,6 +4772,10 @@ export { ISortByGroupSummaryInfoProps, Sorting, ISortingProps, + SpeechRecognitionConfig, + ISpeechRecognitionConfigProps, + SpeechToTextOptions, + ISpeechToTextOptionsProps, StateStoring, IStateStoringProps, StringLengthRule, @@ -4167,6 +4802,10 @@ export { IToolbarItemProps, TotalItem, ITotalItemProps, + TypingUser, + ITypingUserProps, + User, + IUserProps, ValidationRule, IValidationRuleProps, ValueFormat, diff --git a/packages/devextreme-react/src/tree-list.ts b/packages/devextreme-react/src/tree-list.ts index a618090fdfff..18635b1fee32 100644 --- a/packages/devextreme-react/src/tree-list.ts +++ b/packages/devextreme-react/src/tree-list.ts @@ -9,20 +9,23 @@ import dxTreeList, { import { Component as BaseComponent, IHtmlOptions, ComponentRef, NestedComponentMeta } from "./core/component"; import NestedOption from "./core/nested-option"; -import type { dxTreeListColumn, AdaptiveDetailRowPreparingEvent, AIColumnRequestCreatingEvent, CellClickEvent, CellDblClickEvent, CellPreparedEvent, ContentReadyEvent, ContextMenuPreparingEvent, DataErrorOccurredEvent, DisposingEvent, EditCanceledEvent, EditCancelingEvent, EditingStartEvent, EditorPreparedEvent, EditorPreparingEvent, FocusedCellChangingEvent, FocusedRowChangingEvent, InitializedEvent, InitNewRowEvent, KeyDownEvent, NodesInitializedEvent, RowClickEvent, RowCollapsedEvent, RowCollapsingEvent, RowDblClickEvent, RowExpandedEvent, RowExpandingEvent, RowInsertedEvent, RowInsertingEvent, RowPreparedEvent, RowRemovedEvent, RowRemovingEvent, RowUpdatedEvent, RowUpdatingEvent, RowValidatingEvent, SavedEvent, SavingEvent, ToolbarPreparingEvent, dxTreeListRowObject, TreeListPredefinedColumnButton, ColumnButtonClickEvent, dxTreeListColumnButton, TreeListCommandColumnType, TreeListPredefinedToolbarItem, dxTreeListToolbarItem } from "devextreme/ui/tree_list"; +import type { dxTreeListColumn, AdaptiveDetailRowPreparingEvent, AIAssistantRequestCreatingEvent, AIColumnRequestCreatingEvent, CellClickEvent, CellDblClickEvent, CellPreparedEvent, ContentReadyEvent, ContextMenuPreparingEvent, DataErrorOccurredEvent, DisposingEvent, EditCanceledEvent, EditCancelingEvent, EditingStartEvent, EditorPreparedEvent, EditorPreparingEvent, FocusedCellChangingEvent, FocusedRowChangingEvent, InitializedEvent, InitNewRowEvent, KeyDownEvent, NodesInitializedEvent, RowClickEvent, RowCollapsedEvent, RowCollapsingEvent, RowDblClickEvent, RowExpandedEvent, RowExpandingEvent, RowInsertedEvent, RowInsertingEvent, RowPreparedEvent, RowRemovedEvent, RowRemovingEvent, RowUpdatedEvent, RowUpdatingEvent, RowValidatingEvent, SavedEvent, SavingEvent, ToolbarPreparingEvent, dxTreeListRowObject, TreeListPredefinedColumnButton, ColumnButtonClickEvent, dxTreeListColumnButton, TreeListCommandColumnType, TreeListPredefinedToolbarItem, dxTreeListToolbarItem } from "devextreme/ui/tree_list"; import type { DataChange, AIColumnMode, DataChangeType, ColumnAIOptions, FilterOperation, FilterType, FixedPosition, ColumnHeaderFilter as GridsColumnHeaderFilter, SelectedFilterOperation, ColumnChooserMode, ColumnChooserSearchConfig, ColumnChooserSelectionConfig, HeaderFilterGroupInterval, ColumnHeaderFilterSearchConfig, GridsEditMode, GridsEditRefreshMode, StartEditAction, FilterPanel as GridsFilterPanel, FilterPanelTexts as GridsFilterPanelTexts, ApplyFilterMode, HeaderFilterSearchConfig, HeaderFilterTexts, EnterKeyAction, EnterKeyDirection, PagerPageSize, GridBase, DataRenderMode, StateStoreType } from "devextreme/common/grids"; import type { ContentReadyEvent as ButtonContentReadyEvent, DisposingEvent as ButtonDisposingEvent, InitializedEvent as ButtonInitializedEvent, dxButtonOptions, ClickEvent, OptionChangedEvent } from "devextreme/ui/button"; import type { ContentReadyEvent as TextBoxContentReadyEvent, DisposingEvent as TextBoxDisposingEvent, InitializedEvent as TextBoxInitializedEvent, KeyDownEvent as TextBoxKeyDownEvent, dxTextBoxOptions, OptionChangedEvent as TextBoxOptionChangedEvent, TextBoxType, ChangeEvent, CopyEvent, CutEvent, EnterKeyEvent, FocusInEvent, FocusOutEvent, InputEvent, KeyUpEvent, PasteEvent, ValueChangedEvent } from "devextreme/ui/text_box"; +import type { ContentReadyEvent as FileUploaderContentReadyEvent, DisposingEvent as FileUploaderDisposingEvent, InitializedEvent as FileUploaderInitializedEvent, OptionChangedEvent as FileUploaderOptionChangedEvent, dxFileUploaderOptions, ValueChangedEvent as FileUploaderValueChangedEvent, BeforeSendEvent, DropZoneEnterEvent, DropZoneLeaveEvent, FilesUploadedEvent, ProgressEvent, UploadAbortedEvent, UploadedEvent, UploadErrorEvent, UploadStartedEvent, UploadHttpMethod, FileUploadMode } from "devextreme/ui/file_uploader"; import type { ContentReadyEvent as FilterBuilderContentReadyEvent, DisposingEvent as FilterBuilderDisposingEvent, EditorPreparedEvent as FilterBuilderEditorPreparedEvent, EditorPreparingEvent as FilterBuilderEditorPreparingEvent, InitializedEvent as FilterBuilderInitializedEvent, OptionChangedEvent as FilterBuilderOptionChangedEvent, dxFilterBuilderField, FieldInfo, ValueChangedEvent as FilterBuilderValueChangedEvent, FilterBuilderOperation, dxFilterBuilderCustomOperation, GroupOperation } from "devextreme/ui/filter_builder"; import type { ContentReadyEvent as FormContentReadyEvent, DisposingEvent as FormDisposingEvent, InitializedEvent as FormInitializedEvent, FormItemType, FormPredefinedButtonItem, OptionChangedEvent as FormOptionChangedEvent, dxFormSimpleItem, dxFormOptions, dxFormGroupItem, dxFormTabbedItem, dxFormEmptyItem, dxFormButtonItem, LabelLocation, FormLabelMode, EditorEnterKeyEvent, FieldDataChangedEvent, SmartPastedEvent, SmartPastingEvent, FormItemComponent } from "devextreme/ui/form"; +import type { ContentReadyEvent as SpeechToTextContentReadyEvent, DisposingEvent as SpeechToTextDisposingEvent, InitializedEvent as SpeechToTextInitializedEvent, OptionChangedEvent as SpeechToTextOptionChangedEvent, dxSpeechToTextOptions, CustomSpeechRecognizer as SpeechToTextCustomSpeechRecognizer, EndEvent, ErrorEvent, ResultEvent, StartClickEvent, StopClickEvent, SpeechRecognitionConfig as SpeechToTextSpeechRecognitionConfig } from "devextreme/ui/speech_to_text"; import type { ContentReadyEvent as TabPanelContentReadyEvent, DisposingEvent as TabPanelDisposingEvent, InitializedEvent as TabPanelInitializedEvent, OptionChangedEvent as TabPanelOptionChangedEvent, dxTabPanelOptions, dxTabPanelItem, ItemClickEvent, ItemContextMenuEvent, ItemHoldEvent, ItemRenderedEvent, SelectionChangedEvent, SelectionChangingEvent, TitleClickEvent, TitleHoldEvent, TitleRenderedEvent } from "devextreme/ui/tab_panel"; +import type { DisposingEvent as ChatDisposingEvent, InitializedEvent as ChatInitializedEvent, dxChatOptions, OptionChangedEvent as ChatOptionChangedEvent, Alert as ChatAlert, Message, AttachmentDownloadClickEvent, InputFieldTextChangedEvent, MessageDeletedEvent, MessageDeletingEvent, MessageEditCanceledEvent, MessageEditingStartEvent, MessageEnteredEvent, MessageUpdatedEvent, MessageUpdatingEvent, TypingEndEvent, TypingStartEvent, SendButtonProperties, User as ChatUser, Attachment as ChatAttachment, SendButtonAction, SendButtonClickEvent } from "devextreme/ui/chat"; import type { AIIntegration } from "devextreme/common/ai-integration"; +import type { dxPopupOptions, dxPopupToolbarItem, ToolbarLocation } from "devextreme/ui/popup"; import type { AnimationConfig, CollisionResolution, PositionConfig, AnimationState, AnimationType, CollisionResolutionCombination } from "devextreme/common/core/animation"; -import type { ValidationRuleType, HorizontalAlignment, VerticalAlignment, template, TextEditorButtonLocation, ButtonStyle, ButtonType, DataType, Format as CommonFormat, SortOrder, SearchMode, ComparisonOperator, TextBoxPredefinedButton, TextEditorButton, LabelMode, MaskMode, EditorStyle, ValidationMessageMode, Position as CommonPosition, ValidationStatus, PositionAlignment, Mode, Direction, ToolbarItemLocation, ToolbarItemComponent, DisplayMode, DragDirection, DragHighlight, ScrollMode, ScrollbarMode, SingleMultipleOrNone, TabsIconPosition, TabsStyle } from "devextreme/common"; -import type { Format as LocalizationFormat } from "devextreme/common/core/localization"; +import type { ValidationRuleType, HorizontalAlignment, VerticalAlignment, template, TextEditorButtonLocation, ButtonStyle, ButtonType, Format as CommonFormat, DataType, SortOrder, SearchMode, ComparisonOperator, TextBoxPredefinedButton, TextEditorButton, LabelMode, MaskMode, EditorStyle, ValidationMessageMode, Position as CommonPosition, ValidationStatus, PositionAlignment, Mode, Direction, ToolbarItemLocation, ToolbarItemComponent, DisplayMode, DragDirection, DragHighlight, ScrollMode, ScrollbarMode, SingleMultipleOrNone, TabsIconPosition, TabsStyle } from "devextreme/common"; import type { DataSourceOptions } from "devextreme/data/data_source"; import type { Store } from "devextreme/data/store"; -import type { dxPopupOptions, dxPopupToolbarItem, ToolbarLocation } from "devextreme/ui/popup"; +import type { Format as LocalizationFormat } from "devextreme/common/core/localization"; import type { event } from "devextreme/events/events.types"; import type { EventInfo } from "devextreme/common/core/events"; import type { Component } from "devextreme/core/component"; @@ -31,13 +34,15 @@ import type { CollectionWidgetItem } from "devextreme/ui/collection/ui.collectio import type { LocateInMenuMode, ShowTextMode } from "devextreme/ui/toolbar"; import type { LoadPanelIndicatorProperties } from "devextreme/ui/load_panel"; +import type DataSource from "devextreme/data/data_source"; +import type dxChat from "devextreme/ui/chat"; +import type UploadInfo from "devextreme/file_management/upload_info"; import type dxOverlay from "devextreme/ui/overlay"; import type DOMComponent from "devextreme/core/dom_component"; import type dxPopup from "devextreme/ui/popup"; import type dxForm from "devextreme/ui/form"; import type dxSortable from "devextreme/ui/sortable"; import type dxDraggable from "devextreme/ui/draggable"; -import type DataSource from "devextreme/data/data_source"; import type * as CommonTypes from "devextreme/common"; @@ -47,6 +52,7 @@ type ReplaceFieldTypes = { type ITreeListOptionsNarrowedEvents = { onAdaptiveDetailRowPreparing?: ((e: AdaptiveDetailRowPreparingEvent) => void); + onAIAssistantRequestCreating?: ((e: AIAssistantRequestCreatingEvent) => void); onAIColumnRequestCreating?: ((e: AIColumnRequestCreatingEvent) => void); onCellClick?: ((e: CellClickEvent) => void); onCellDblClick?: ((e: CellDblClickEvent) => void); @@ -124,8 +130,8 @@ const TreeList = memo( } ), []); - const subscribableOptions = useMemo(() => (["columns","editing","editing.changes","editing.editColumnName","editing.editRowKey","expandedRowKeys","filterValue","focusedColumnIndex","focusedRowIndex","focusedRowKey","paging","paging.pageIndex","paging.pageSize","selectedRowKeys","filterBuilder.value","filterBuilderPopup.height","filterBuilderPopup.position","filterBuilderPopup.visible","filterBuilderPopup.width","filterPanel.filterEnabled","editing.form.formData","editing.popup.height","editing.popup.position","editing.popup.visible","editing.popup.width","searchPanel.text"]), []); - const independentEvents = useMemo(() => (["onAdaptiveDetailRowPreparing","onAIColumnRequestCreating","onCellClick","onCellDblClick","onCellPrepared","onContentReady","onContextMenuPreparing","onDataErrorOccurred","onDisposing","onEditCanceled","onEditCanceling","onEditingStart","onEditorPrepared","onEditorPreparing","onFocusedCellChanging","onFocusedRowChanging","onInitialized","onInitNewRow","onKeyDown","onNodesInitialized","onRowClick","onRowCollapsed","onRowCollapsing","onRowDblClick","onRowExpanded","onRowExpanding","onRowInserted","onRowInserting","onRowPrepared","onRowRemoved","onRowRemoving","onRowUpdated","onRowUpdating","onRowValidating","onSaved","onSaving","onToolbarPreparing"]), []); + const subscribableOptions = useMemo(() => (["columns","editing","editing.changes","editing.editColumnName","editing.editRowKey","expandedRowKeys","filterValue","focusedColumnIndex","focusedRowIndex","focusedRowKey","paging","paging.pageIndex","paging.pageSize","selectedRowKeys","aIAssistant.chat.items","chat.editing.changes","chat.editing.editColumnName","chat.editing.editRowKey","filterBuilder.value","filterBuilderPopup.height","filterBuilderPopup.position","filterBuilderPopup.visible","filterBuilderPopup.width","filterPanel.filterEnabled","treeListEditing.form.formData","treeListEditing.popup.height","aIAssistant.popup.height","treeListEditing.popup.position","aIAssistant.popup.position","treeListEditing.popup.visible","aIAssistant.popup.visible","treeListEditing.popup.width","aIAssistant.popup.width","searchPanel.text"]), []); + const independentEvents = useMemo(() => (["onAdaptiveDetailRowPreparing","onAIAssistantRequestCreating","onAIColumnRequestCreating","onCellClick","onCellDblClick","onCellPrepared","onContentReady","onContextMenuPreparing","onDataErrorOccurred","onDisposing","onEditCanceled","onEditCanceling","onEditingStart","onEditorPrepared","onEditorPreparing","onFocusedCellChanging","onFocusedRowChanging","onInitialized","onInitNewRow","onKeyDown","onNodesInitialized","onRowClick","onRowCollapsed","onRowCollapsing","onRowDblClick","onRowExpanded","onRowExpanding","onRowInserted","onRowInserting","onRowPrepared","onRowRemoved","onRowRemoving","onRowUpdated","onRowUpdating","onRowValidating","onSaved","onSaving","onToolbarPreparing"]), []); const defaults = useMemo(() => ({ defaultColumns: "columns", @@ -140,6 +146,7 @@ const TreeList = memo( }), []); const expectedChildren = useMemo(() => ({ + aiAssistant: { optionName: "aiAssistant", isCollectionItem: false }, column: { optionName: "columns", isCollectionItem: true }, columnChooser: { optionName: "columnChooser", isCollectionItem: false }, columnFixing: { optionName: "columnFixing", isCollectionItem: false }, @@ -161,6 +168,7 @@ const TreeList = memo( sorting: { optionName: "sorting", isCollectionItem: false }, stateStoring: { optionName: "stateStoring", isCollectionItem: false }, toolbar: { optionName: "toolbar", isCollectionItem: false }, + treeListEditing: { optionName: "editing", isCollectionItem: false }, treeListHeaderFilter: { optionName: "headerFilter", isCollectionItem: false }, treeListSelection: { optionName: "selection", isCollectionItem: false } }), []); @@ -209,6 +217,32 @@ const AI = Object.assign(_componentAI, componentType: "option", }); +// owners: +// TreeList +type IAIAssistantProps = React.PropsWithChildren<{ + aiIntegration?: AIIntegration; + chat?: dxChatOptions; + enabled?: boolean; + popup?: dxPopupOptions; + title?: string; +}> +const _componentAIAssistant = (props: IAIAssistantProps) => { + return React.createElement(NestedOption, { + ...props, + elementDescriptor: { + OptionName: "aiAssistant", + ExpectedChildren: { + chat: { optionName: "chat", isCollectionItem: false }, + popup: { optionName: "popup", isCollectionItem: false } + }, + }, + }); +}; + +const AIAssistant = Object.assign(_componentAIAssistant, { + componentType: "option", +}); + // owners: // FormItem // SimpleItem @@ -229,6 +263,26 @@ const AIOptions = Object.assign componentType: "option", }); +// owners: +// Chat +type IAlertProps = React.PropsWithChildren<{ + id?: number | string; + message?: string; +}> +const _componentAlert = (props: IAlertProps) => { + return React.createElement(NestedOption, { + ...props, + elementDescriptor: { + OptionName: "alerts", + IsCollectionItem: true, + }, + }); +}; + +const Alert = Object.assign(_componentAlert, { + componentType: "option", +}); + // owners: // Popup // FilterBuilderPopup @@ -300,6 +354,47 @@ const At = Object.assign(_componentAt, componentType: "option", }); +// owners: +// ChatItem +type IAttachmentProps = React.PropsWithChildren<{ + name?: string; + size?: number; +}> +const _componentAttachment = (props: IAttachmentProps) => { + return React.createElement(NestedOption, { + ...props, + elementDescriptor: { + OptionName: "attachments", + IsCollectionItem: true, + }, + }); +}; + +const Attachment = Object.assign(_componentAttachment, { + componentType: "option", +}); + +// owners: +// ChatItem +type IAuthorProps = React.PropsWithChildren<{ + avatarAlt?: string; + avatarUrl?: string; + id?: number | string; + name?: string; +}> +const _componentAuthor = (props: IAuthorProps) => { + return React.createElement(NestedOption, { + ...props, + elementDescriptor: { + OptionName: "author", + }, + }); +}; + +const Author = Object.assign(_componentAuthor, { + componentType: "option", +}); + // owners: // Position type IBoundaryOffsetProps = React.PropsWithChildren<{ @@ -441,7 +536,7 @@ const ButtonOptions = Object.assign(_comp componentType: "option", }); +// owners: +// AIAssistant +type IChatProps = React.PropsWithChildren<{ + accessKey?: string | undefined; + activeStateEnabled?: boolean; + alerts?: Array; + dataSource?: Array | DataSource | DataSourceOptions | null | Store | string; + dayHeaderFormat?: LocalizationFormat; + disabled?: boolean; + editing?: Record | { + allowDeleting?: boolean | ((options: { component: dxChat, message: Message }) => boolean); + allowUpdating?: boolean | ((options: { component: dxChat, message: Message }) => boolean); + }; + elementAttr?: Record; + emptyViewTemplate?: ((data: { component: dxChat, texts: Record }, itemElement: any) => string | any) | null | template; + fileUploaderOptions?: dxFileUploaderOptions; + focusStateEnabled?: boolean; + height?: number | string | undefined; + hint?: string | undefined; + hoverStateEnabled?: boolean; + inputFieldText?: string | undefined; + items?: Array; + messageTemplate?: ((data: { component: dxChat, message: Message }, messageBubbleElement: any) => string | any) | null | template; + messageTimestampFormat?: LocalizationFormat; + onAttachmentDownloadClick?: ((e: AttachmentDownloadClickEvent) => void) | undefined; + onDisposing?: ((e: ChatDisposingEvent) => void); + onInitialized?: ((e: ChatInitializedEvent) => void); + onInputFieldTextChanged?: ((e: InputFieldTextChangedEvent) => void) | undefined; + onMessageDeleted?: ((e: MessageDeletedEvent) => void) | undefined; + onMessageDeleting?: ((e: MessageDeletingEvent) => void) | undefined; + onMessageEditCanceled?: ((e: MessageEditCanceledEvent) => void) | undefined; + onMessageEditingStart?: ((e: MessageEditingStartEvent) => void) | undefined; + onMessageEntered?: ((e: MessageEnteredEvent) => void) | undefined; + onMessageUpdated?: ((e: MessageUpdatedEvent) => void) | undefined; + onMessageUpdating?: ((e: MessageUpdatingEvent) => void) | undefined; + onOptionChanged?: ((e: ChatOptionChangedEvent) => void); + onTypingEnd?: ((e: TypingEndEvent) => void) | undefined; + onTypingStart?: ((e: TypingStartEvent) => void) | undefined; + reloadOnChange?: boolean; + rtlEnabled?: boolean; + sendButtonOptions?: SendButtonProperties; + showAvatar?: boolean; + showDayHeaders?: boolean; + showMessageTimestamp?: boolean; + showUserName?: boolean; + speechToTextEnabled?: boolean; + speechToTextOptions?: dxSpeechToTextOptions; + typingUsers?: Array; + user?: ChatUser; + visible?: boolean; + width?: number | string | undefined; + defaultItems?: Array; + onItemsChange?: (value: Array) => void; + emptyViewRender?: (...params: any) => React.ReactNode; + emptyViewComponent?: React.ComponentType; + messageRender?: (...params: any) => React.ReactNode; + messageComponent?: React.ComponentType; +}> +const _componentChat = (props: IChatProps) => { + return React.createElement(NestedOption, { + ...props, + elementDescriptor: { + OptionName: "chat", + DefaultsProps: { + defaultItems: "items" + }, + ExpectedChildren: { + alert: { optionName: "alerts", isCollectionItem: true }, + chatEditing: { optionName: "editing", isCollectionItem: false }, + chatItem: { optionName: "items", isCollectionItem: true }, + dayHeaderFormat: { optionName: "dayHeaderFormat", isCollectionItem: false }, + editing: { optionName: "editing", isCollectionItem: false }, + fileUploaderOptions: { optionName: "fileUploaderOptions", isCollectionItem: false }, + item: { optionName: "items", isCollectionItem: true }, + messageTimestampFormat: { optionName: "messageTimestampFormat", isCollectionItem: false }, + sendButtonOptions: { optionName: "sendButtonOptions", isCollectionItem: false }, + speechToTextOptions: { optionName: "speechToTextOptions", isCollectionItem: false }, + typingUser: { optionName: "typingUsers", isCollectionItem: true }, + user: { optionName: "user", isCollectionItem: false } + }, + TemplateProps: [{ + tmplOption: "emptyViewTemplate", + render: "emptyViewRender", + component: "emptyViewComponent" + }, { + tmplOption: "messageTemplate", + render: "messageRender", + component: "messageComponent" + }], + }, + }); +}; + +const Chat = Object.assign(_componentChat, { + componentType: "option", +}); + +// owners: +// Chat +type IChatEditingProps = React.PropsWithChildren<{ + allowDeleting?: boolean | ((options: { component: dxChat, message: Message }) => boolean); + allowUpdating?: boolean | ((options: { component: dxChat, message: Message }) => boolean); +}> +const _componentChatEditing = (props: IChatEditingProps) => { + return React.createElement(NestedOption, { + ...props, + elementDescriptor: { + OptionName: "editing", + }, + }); +}; + +const ChatEditing = Object.assign(_componentChatEditing, { + componentType: "option", +}); + +// owners: +// Chat +type IChatItemProps = React.PropsWithChildren<{ + alt?: string; + attachments?: Array; + author?: ChatUser; + id?: number | string; + isDeleted?: boolean; + isEdited?: boolean; + src?: string; + text?: string; + timestamp?: Date | number | string; + type?: string | undefined; +}> +const _componentChatItem = (props: IChatItemProps) => { + return React.createElement(NestedOption, { + ...props, + elementDescriptor: { + OptionName: "items", + IsCollectionItem: true, + ExpectedChildren: { + attachment: { optionName: "attachments", isCollectionItem: true }, + author: { optionName: "author", isCollectionItem: false } + }, + }, + }); +}; + +const ChatItem = Object.assign(_componentChatItem, { + componentType: "option", +}); + // owners: // Form // GroupItem @@ -1000,8 +1243,51 @@ const CustomRule = Object.assign +const _componentCustomSpeechRecognizer = (props: ICustomSpeechRecognizerProps) => { + return React.createElement(NestedOption, { + ...props, + elementDescriptor: { + OptionName: "customSpeechRecognizer", + }, + }); +}; + +const CustomSpeechRecognizer = Object.assign(_componentCustomSpeechRecognizer, { + componentType: "option", +}); + +// owners: +// Chat +type IDayHeaderFormatProps = React.PropsWithChildren<{ + currency?: string; + formatter?: ((value: number | Date) => string); + parser?: ((value: string) => number | Date); + precision?: number; + type?: CommonFormat | string; + useCurrencyAccountingStyle?: boolean; +}> +const _componentDayHeaderFormat = (props: IDayHeaderFormatProps) => { + return React.createElement(NestedOption, { + ...props, + elementDescriptor: { + OptionName: "dayHeaderFormat", + }, + }); +}; + +const DayHeaderFormat = Object.assign(_componentDayHeaderFormat, { + componentType: "option", +}); + // owners: // TreeList +// Chat type IEditingProps = React.PropsWithChildren<{ allowAdding?: boolean | ((options: { component: dxTreeList, row: dxTreeListRowObject }) => boolean); allowDeleting?: boolean | ((options: { component: dxTreeList, row: dxTreeListRowObject }) => boolean); @@ -1050,10 +1336,9 @@ const _componentEditing = (props: IEditingProps) => { }, ExpectedChildren: { change: { optionName: "changes", isCollectionItem: true }, - editingTexts: { optionName: "texts", isCollectionItem: false }, form: { optionName: "form", isCollectionItem: false }, popup: { optionName: "popup", isCollectionItem: false }, - texts: { optionName: "texts", isCollectionItem: false } + treeListEditingTexts: { optionName: "texts", isCollectionItem: false } }, }, }); @@ -1063,35 +1348,6 @@ const Editing = Object.assign(_co componentType: "option", }); -// owners: -// Editing -type IEditingTextsProps = React.PropsWithChildren<{ - addRow?: string; - addRowToNode?: string; - cancelAllChanges?: string; - cancelRowChanges?: string; - confirmDeleteMessage?: string; - confirmDeleteTitle?: string; - deleteRow?: string; - editRow?: string; - saveAllChanges?: string; - saveRowChanges?: string; - undeleteRow?: string; - validationCancelChanges?: string; -}> -const _componentEditingTexts = (props: IEditingTextsProps) => { - return React.createElement(NestedOption, { - ...props, - elementDescriptor: { - OptionName: "texts", - }, - }); -}; - -const EditingTexts = Object.assign(_componentEditingTexts, { - componentType: "option", -}); - // owners: // AI type IEditorOptionsProps = React.PropsWithChildren<{ @@ -1319,6 +1575,92 @@ const FieldLookup = Object.assign any); + accept?: string; + accessKey?: string | undefined; + activeStateEnabled?: boolean; + allowCanceling?: boolean; + allowedFileExtensions?: Array; + chunkSize?: number; + dialogTrigger?: any | string | undefined; + disabled?: boolean; + dropZone?: any | string | undefined; + elementAttr?: Record; + focusStateEnabled?: boolean; + height?: number | string | undefined; + hint?: string | undefined; + hoverStateEnabled?: boolean; + inputAttr?: any; + invalidFileExtensionMessage?: string; + invalidMaxFileSizeMessage?: string; + invalidMinFileSizeMessage?: string; + isDirty?: boolean; + isValid?: boolean; + labelText?: string; + maxFileSize?: number; + minFileSize?: number; + multiple?: boolean; + name?: string; + onBeforeSend?: ((e: BeforeSendEvent) => void); + onContentReady?: ((e: FileUploaderContentReadyEvent) => void); + onDisposing?: ((e: FileUploaderDisposingEvent) => void); + onDropZoneEnter?: ((e: DropZoneEnterEvent) => void); + onDropZoneLeave?: ((e: DropZoneLeaveEvent) => void); + onFilesUploaded?: ((e: FilesUploadedEvent) => void); + onInitialized?: ((e: FileUploaderInitializedEvent) => void); + onOptionChanged?: ((e: FileUploaderOptionChangedEvent) => void); + onProgress?: ((e: ProgressEvent) => void); + onUploadAborted?: ((e: UploadAbortedEvent) => void); + onUploaded?: ((e: UploadedEvent) => void); + onUploadError?: ((e: UploadErrorEvent) => void); + onUploadStarted?: ((e: UploadStartedEvent) => void); + onValueChanged?: ((e: FileUploaderValueChangedEvent) => void); + progress?: number; + readOnly?: boolean; + readyToUploadMessage?: string; + rtlEnabled?: boolean; + selectButtonText?: string; + showFileList?: boolean; + tabIndex?: number; + uploadAbortedMessage?: string; + uploadButtonText?: string; + uploadChunk?: ((file: any, uploadInfo: UploadInfo) => any); + uploadCustomData?: any; + uploadedMessage?: string; + uploadFailedMessage?: string; + uploadFile?: ((file: any, progressCallback: (() => void)) => any); + uploadHeaders?: any; + uploadMethod?: UploadHttpMethod; + uploadMode?: FileUploadMode; + uploadUrl?: string; + validationError?: any; + validationErrors?: Array; + validationStatus?: ValidationStatus; + value?: Array; + visible?: boolean; + width?: number | string | undefined; + defaultValue?: Array; + onValueChange?: (value: Array) => void; +}> +const _componentFileUploaderOptions = (props: IFileUploaderOptionsProps) => { + return React.createElement(NestedOption, { + ...props, + elementDescriptor: { + OptionName: "fileUploaderOptions", + DefaultsProps: { + defaultValue: "value" + }, + }, + }); +}; + +const FileUploaderOptions = Object.assign(_componentFileUploaderOptions, { + componentType: "option", +}); + // owners: // TreeList type IFilterBuilderProps = React.PropsWithChildren<{ @@ -1616,7 +1958,7 @@ const FilterRow = Object.assign }); // owners: -// Editing +// TreeListEditing type IFormProps = React.PropsWithChildren<{ accessKey?: string | undefined; activeStateEnabled?: boolean; @@ -1995,6 +2337,7 @@ const IndicatorOptions = Object.assign; + author?: ChatUser; + id?: number | string; + isDeleted?: boolean; + isEdited?: boolean; + src?: string; + timestamp?: Date | number | string; + type?: string | undefined; tabRender?: (...params: any) => React.ReactNode; tabComponent?: React.ComponentType; render?: (...params: any) => React.ReactNode; @@ -2084,6 +2436,8 @@ const _componentItem = (props: IItemProps) => { ExpectedChildren: { aiOptions: { optionName: "aiOptions", isCollectionItem: false }, AsyncRule: { optionName: "validationRules", isCollectionItem: true }, + attachment: { optionName: "attachments", isCollectionItem: true }, + author: { optionName: "author", isCollectionItem: false }, buttonOptions: { optionName: "buttonOptions", isCollectionItem: false }, colCountByScreen: { optionName: "colCountByScreen", isCollectionItem: false }, CompareRule: { optionName: "validationRules", isCollectionItem: true }, @@ -2229,6 +2583,29 @@ const Lookup = Object.assign(_comp componentType: "option", }); +// owners: +// Chat +type IMessageTimestampFormatProps = React.PropsWithChildren<{ + currency?: string; + formatter?: ((value: number | Date) => string); + parser?: ((value: string) => number | Date); + precision?: number; + type?: CommonFormat | string; + useCurrencyAccountingStyle?: boolean; +}> +const _componentMessageTimestampFormat = (props: IMessageTimestampFormatProps) => { + return React.createElement(NestedOption, { + ...props, + elementDescriptor: { + OptionName: "messageTimestampFormat", + }, + }); +}; + +const MessageTimestampFormat = Object.assign(_componentMessageTimestampFormat, { + componentType: "option", +}); + // owners: // Position type IMyProps = React.PropsWithChildren<{ @@ -2450,7 +2827,8 @@ const PatternRule = Object.assign | { @@ -2829,6 +3207,26 @@ const Selection = Object.assign componentType: "option", }); +// owners: +// Chat +type ISendButtonOptionsProps = React.PropsWithChildren<{ + action?: SendButtonAction; + icon?: string; + onClick?: ((e: SendButtonClickEvent) => void); +}> +const _componentSendButtonOptions = (props: ISendButtonOptionsProps) => { + return React.createElement(NestedOption, { + ...props, + elementDescriptor: { + OptionName: "sendButtonOptions", + }, + }); +}; + +const SendButtonOptions = Object.assign(_componentSendButtonOptions, { + componentType: "option", +}); + // owners: // Animation type IShowProps = React.PropsWithChildren<{ @@ -2949,6 +3347,78 @@ const Sorting = Object.assign(_co componentType: "option", }); +// owners: +// SpeechToTextOptions +type ISpeechRecognitionConfigProps = React.PropsWithChildren<{ + continuous?: boolean; + grammars?: Array; + interimResults?: boolean; + lang?: string; + maxAlternatives?: number; +}> +const _componentSpeechRecognitionConfig = (props: ISpeechRecognitionConfigProps) => { + return React.createElement(NestedOption, { + ...props, + elementDescriptor: { + OptionName: "speechRecognitionConfig", + }, + }); +}; + +const SpeechRecognitionConfig = Object.assign(_componentSpeechRecognitionConfig, { + componentType: "option", +}); + +// owners: +// Chat +type ISpeechToTextOptionsProps = React.PropsWithChildren<{ + accessKey?: string | undefined; + activeStateEnabled?: boolean; + customSpeechRecognizer?: SpeechToTextCustomSpeechRecognizer; + disabled?: boolean; + elementAttr?: Record; + focusStateEnabled?: boolean; + height?: number | string | undefined; + hint?: string | undefined; + hoverStateEnabled?: boolean; + onContentReady?: ((e: SpeechToTextContentReadyEvent) => void); + onDisposing?: ((e: SpeechToTextDisposingEvent) => void); + onEnd?: ((e: EndEvent) => void) | undefined; + onError?: ((e: ErrorEvent) => void) | undefined; + onInitialized?: ((e: SpeechToTextInitializedEvent) => void); + onOptionChanged?: ((e: SpeechToTextOptionChangedEvent) => void); + onResult?: ((e: ResultEvent) => void) | undefined; + onStartClick?: ((e: StartClickEvent) => void) | undefined; + onStopClick?: ((e: StopClickEvent) => void) | undefined; + rtlEnabled?: boolean; + speechRecognitionConfig?: Record | SpeechToTextSpeechRecognitionConfig; + startIcon?: string; + startText?: string; + stopIcon?: string; + stopText?: string; + stylingMode?: ButtonStyle; + tabIndex?: number; + type?: ButtonType | string; + visible?: boolean; + width?: number | string | undefined; +}> +const _componentSpeechToTextOptions = (props: ISpeechToTextOptionsProps) => { + return React.createElement(NestedOption, { + ...props, + elementDescriptor: { + OptionName: "speechToTextOptions", + ExpectedChildren: { + customSpeechRecognizer: { optionName: "customSpeechRecognizer", isCollectionItem: false }, + speechRecognitionConfig: { optionName: "speechRecognitionConfig", isCollectionItem: false } + }, + }, + }); +}; + +const SpeechToTextOptions = Object.assign(_componentSpeechToTextOptions, { + componentType: "option", +}); + // owners: // TreeList type IStateStoringProps = React.PropsWithChildren<{ @@ -3230,7 +3700,7 @@ const TabPanelOptionsItem = Object.assign boolean); + allowDeleting?: boolean | ((options: { component: dxTreeList, row: dxTreeListRowObject }) => boolean); + allowUpdating?: boolean | ((options: { component: dxTreeList, row: dxTreeListRowObject }) => boolean); + changes?: Array; + confirmDelete?: boolean; + editColumnName?: string; + editRowKey?: any; + form?: dxFormOptions; + mode?: GridsEditMode; + popup?: dxPopupOptions; + refreshMode?: GridsEditRefreshMode; + selectTextOnEditStart?: boolean; + startEditAction?: StartEditAction; + texts?: Record | { + addRow?: string; + addRowToNode?: string; + cancelAllChanges?: string; + cancelRowChanges?: string; + confirmDeleteMessage?: string; + confirmDeleteTitle?: string; + deleteRow?: string; + editRow?: string; + saveAllChanges?: string; + saveRowChanges?: string; + undeleteRow?: string; + validationCancelChanges?: string; + }; + useIcons?: boolean; + defaultChanges?: Array; + onChangesChange?: (value: Array) => void; + defaultEditColumnName?: string; + onEditColumnNameChange?: (value: string) => void; + defaultEditRowKey?: any; + onEditRowKeyChange?: (value: any) => void; +}> +const _componentTreeListEditing = (props: ITreeListEditingProps) => { + return React.createElement(NestedOption, { + ...props, + elementDescriptor: { + OptionName: "editing", + DefaultsProps: { + defaultChanges: "changes", + defaultEditColumnName: "editColumnName", + defaultEditRowKey: "editRowKey" + }, + ExpectedChildren: { + change: { optionName: "changes", isCollectionItem: true }, + form: { optionName: "form", isCollectionItem: false }, + popup: { optionName: "popup", isCollectionItem: false }, + texts: { optionName: "texts", isCollectionItem: false }, + treeListEditingTexts: { optionName: "texts", isCollectionItem: false } + }, + }, + }); +}; + +const TreeListEditing = Object.assign(_componentTreeListEditing, { + componentType: "option", +}); + +// owners: +// TreeListEditing +type ITreeListEditingTextsProps = React.PropsWithChildren<{ + addRow?: string; + addRowToNode?: string; + cancelAllChanges?: string; + cancelRowChanges?: string; + confirmDeleteMessage?: string; + confirmDeleteTitle?: string; + deleteRow?: string; + editRow?: string; + saveAllChanges?: string; + saveRowChanges?: string; + undeleteRow?: string; + validationCancelChanges?: string; +}> +const _componentTreeListEditingTexts = (props: ITreeListEditingTextsProps) => { + return React.createElement(NestedOption, { + ...props, + elementDescriptor: { + OptionName: "texts", + }, + }); +}; + +const TreeListEditingTexts = Object.assign(_componentTreeListEditingTexts, { + componentType: "option", +}); + // owners: // TreeList type ITreeListHeaderFilterProps = React.PropsWithChildren<{ @@ -3503,6 +4065,49 @@ const TreeListToolbarItem = Object.assign +const _componentTypingUser = (props: ITypingUserProps) => { + return React.createElement(NestedOption, { + ...props, + elementDescriptor: { + OptionName: "typingUsers", + IsCollectionItem: true, + }, + }); +}; + +const TypingUser = Object.assign(_componentTypingUser, { + componentType: "option", +}); + +// owners: +// Chat +type IUserProps = React.PropsWithChildren<{ + avatarAlt?: string; + avatarUrl?: string; + id?: number | string; + name?: string; +}> +const _componentUser = (props: IUserProps) => { + return React.createElement(NestedOption, { + ...props, + elementDescriptor: { + OptionName: "user", + }, + }); +}; + +const User = Object.assign(_componentUser, { + componentType: "option", +}); + // owners: // FormItem // Column @@ -3544,14 +4149,22 @@ export { TreeListRef, AI, IAIProps, + AIAssistant, + IAIAssistantProps, AIOptions, IAIOptionsProps, + Alert, + IAlertProps, Animation, IAnimationProps, AsyncRule, IAsyncRuleProps, At, IAtProps, + Attachment, + IAttachmentProps, + Author, + IAuthorProps, BoundaryOffset, IBoundaryOffsetProps, Button, @@ -3562,6 +4175,12 @@ export { IButtonOptionsProps, Change, IChangeProps, + Chat, + IChatProps, + ChatEditing, + IChatEditingProps, + ChatItem, + IChatItemProps, ColCountByScreen, IColCountByScreenProps, Collision, @@ -3594,10 +4213,12 @@ export { ICustomOperationProps, CustomRule, ICustomRuleProps, + CustomSpeechRecognizer, + ICustomSpeechRecognizerProps, + DayHeaderFormat, + IDayHeaderFormatProps, Editing, IEditingProps, - EditingTexts, - IEditingTextsProps, EditorOptions, IEditorOptionsProps, EditorOptionsButton, @@ -3610,6 +4231,8 @@ export { IFieldProps, FieldLookup, IFieldLookupProps, + FileUploaderOptions, + IFileUploaderOptionsProps, FilterBuilder, IFilterBuilderProps, FilterBuilderPopup, @@ -3652,6 +4275,8 @@ export { ILoadPanelProps, Lookup, ILookupProps, + MessageTimestampFormat, + IMessageTimestampFormatProps, My, IMyProps, NumericRule, @@ -3688,12 +4313,18 @@ export { ISearchPanelProps, Selection, ISelectionProps, + SendButtonOptions, + ISendButtonOptionsProps, Show, IShowProps, SimpleItem, ISimpleItemProps, Sorting, ISortingProps, + SpeechRecognitionConfig, + ISpeechRecognitionConfigProps, + SpeechToTextOptions, + ISpeechToTextOptionsProps, StateStoring, IStateStoringProps, StringLengthRule, @@ -3714,6 +4345,10 @@ export { IToolbarProps, ToolbarItem, IToolbarItemProps, + TreeListEditing, + ITreeListEditingProps, + TreeListEditingTexts, + ITreeListEditingTextsProps, TreeListHeaderFilter, ITreeListHeaderFilterProps, TreeListHeaderFilterSearch, @@ -3724,6 +4359,10 @@ export { ITreeListSelectionProps, TreeListToolbarItem, ITreeListToolbarItemProps, + TypingUser, + ITypingUserProps, + User, + IUserProps, ValidationRule, IValidationRuleProps }; diff --git a/packages/devextreme-vue/src/common/grids.ts b/packages/devextreme-vue/src/common/grids.ts index 3a2c80da1a00..2cf419615368 100644 --- a/packages/devextreme-vue/src/common/grids.ts +++ b/packages/devextreme-vue/src/common/grids.ts @@ -1,5 +1,7 @@ export type { AdaptiveDetailRowPreparingInfo, + AIAssistant, + AIAssistantRequestCreatingInfo, AIColumnMode, AIColumnRequestCreatingInfo, ApplyChangesMode, diff --git a/packages/devextreme-vue/src/common/index.ts b/packages/devextreme-vue/src/common/index.ts index 44eee965a2a0..2986f0bf89c6 100644 --- a/packages/devextreme-vue/src/common/index.ts +++ b/packages/devextreme-vue/src/common/index.ts @@ -273,6 +273,8 @@ export namespace Export { export function Grids(): void {} export namespace Grids { export type AdaptiveDetailRowPreparingInfo = GridsModule.AdaptiveDetailRowPreparingInfo; + export type AIAssistant = GridsModule.AIAssistant; + export type AIAssistantRequestCreatingInfo = GridsModule.AIAssistantRequestCreatingInfo; export type AIColumnMode = GridsModule.AIColumnMode; export type AIColumnRequestCreatingInfo = GridsModule.AIColumnRequestCreatingInfo; export type ApplyChangesMode = GridsModule.ApplyChangesMode; diff --git a/packages/devextreme-vue/src/data-grid.ts b/packages/devextreme-vue/src/data-grid.ts index 3015cf797c17..3769f56a45ba 100644 --- a/packages/devextreme-vue/src/data-grid.ts +++ b/packages/devextreme-vue/src/data-grid.ts @@ -5,15 +5,15 @@ import { prepareComponentConfig } from "./core/index"; import DataGrid, { Properties } from "devextreme/ui/data_grid"; import DataSource from "devextreme/data/data_source"; import dxDataGrid from "devextreme/ui/data_grid"; +import dxChat from "devextreme/ui/chat"; +import UploadInfo from "devextreme/file_management/upload_info"; import dxOverlay from "devextreme/ui/overlay"; import DOMComponent from "devextreme/core/dom_component"; import dxPopup from "devextreme/ui/popup"; import dxSortable from "devextreme/ui/sortable"; import dxDraggable from "devextreme/ui/draggable"; import { - AIIntegration, -} from "devextreme/common/ai-integration"; -import { + AIAssistant, ColumnChooser, ColumnResizeMode, FilterPanel, @@ -35,13 +35,13 @@ import { HeaderFilterGroupInterval, ColumnHeaderFilterSearchConfig, HeaderFilterSearchConfig, - HeaderFilterTexts, - SelectionColumnDisplayMode, DataChange, GridsEditMode, NewRowPosition, GridsEditRefreshMode, StartEditAction, + HeaderFilterTexts, + SelectionColumnDisplayMode, FilterPanelTexts, ApplyFilterMode, GroupExpandMode, @@ -53,9 +53,13 @@ import { DataRenderMode, StateStoreType, } from "devextreme/common/grids"; +import { + AIIntegration, +} from "devextreme/common/ai-integration"; import { dxDataGridColumn, AdaptiveDetailRowPreparingEvent, + AIAssistantRequestCreatingEvent, AIColumnRequestCreatingEvent, CellClickEvent, CellDblClickEvent, @@ -117,8 +121,8 @@ import { TextEditorButtonLocation, ButtonStyle, ButtonType, - DataType, Format as CommonFormat, + DataType, SortOrder, SearchMode, ComparisonOperator, @@ -191,6 +195,30 @@ import { PasteEvent, ValueChangedEvent, } from "devextreme/ui/text_box"; +import { + dxChatOptions, + Alert, + Message, + AttachmentDownloadClickEvent, + DisposingEvent as ChatDisposingEvent, + InitializedEvent as ChatInitializedEvent, + InputFieldTextChangedEvent, + MessageDeletedEvent, + MessageDeletingEvent, + MessageEditCanceledEvent, + MessageEditingStartEvent, + MessageEnteredEvent, + MessageUpdatedEvent, + MessageUpdatingEvent, + OptionChangedEvent as ChatOptionChangedEvent, + TypingEndEvent, + TypingStartEvent, + SendButtonProperties, + User, + Attachment, + SendButtonAction, + SendButtonClickEvent, +} from "devextreme/ui/chat"; import { AnimationConfig, CollisionResolution, @@ -231,6 +259,39 @@ import { import { Format, } from "devextreme/common/core/localization"; +import { + dxFileUploaderOptions, + BeforeSendEvent, + ContentReadyEvent as FileUploaderContentReadyEvent, + DisposingEvent as FileUploaderDisposingEvent, + DropZoneEnterEvent, + DropZoneLeaveEvent, + FilesUploadedEvent, + InitializedEvent as FileUploaderInitializedEvent, + OptionChangedEvent as FileUploaderOptionChangedEvent, + ProgressEvent, + UploadAbortedEvent, + UploadedEvent, + UploadErrorEvent, + UploadStartedEvent, + ValueChangedEvent as FileUploaderValueChangedEvent, + UploadHttpMethod, + FileUploadMode, +} from "devextreme/ui/file_uploader"; +import { + dxSpeechToTextOptions, + CustomSpeechRecognizer, + ContentReadyEvent as SpeechToTextContentReadyEvent, + DisposingEvent as SpeechToTextDisposingEvent, + EndEvent, + ErrorEvent, + InitializedEvent as SpeechToTextInitializedEvent, + OptionChangedEvent as SpeechToTextOptionChangedEvent, + ResultEvent, + StartClickEvent, + StopClickEvent, + SpeechRecognitionConfig, +} from "devextreme/ui/speech_to_text"; import { LocateInMenuMode, ShowTextMode, @@ -273,6 +334,7 @@ import { prepareConfigurationComponentConfig } from "./core/index"; type AccessibleOptions = Pick>, aiIntegration: Object as PropType, allowColumnReordering: Boolean, allowColumnResizing: Boolean, @@ -445,6 +509,7 @@ const componentConfig = { masterDetail: Object as PropType>, noDataText: String, onAdaptiveDetailRowPreparing: Function as PropType<((e: AdaptiveDetailRowPreparingEvent) => void)>, + onAIAssistantRequestCreating: Function as PropType<((e: AIAssistantRequestCreatingEvent) => void)>, onAIColumnRequestCreating: Function as PropType<((e: AIColumnRequestCreatingEvent) => void)>, onCellClick: Function as PropType<((e: CellClickEvent) => void)>, onCellDblClick: Function as PropType<((e: CellDblClickEvent) => void)>, @@ -521,6 +586,7 @@ const componentConfig = { "update:hoveredElement": null, "update:accessKey": null, "update:activeStateEnabled": null, + "update:aiAssistant": null, "update:aiIntegration": null, "update:allowColumnReordering": null, "update:allowColumnResizing": null, @@ -567,6 +633,7 @@ const componentConfig = { "update:masterDetail": null, "update:noDataText": null, "update:onAdaptiveDetailRowPreparing": null, + "update:onAIAssistantRequestCreating": null, "update:onAIColumnRequestCreating": null, "update:onCellClick": null, "update:onCellDblClick": null, @@ -647,9 +714,11 @@ const componentConfig = { (this as any).$_WidgetClass = DataGrid; (this as any).$_hasAsyncTemplate = false; (this as any).$_expectedChildren = { + aiAssistant: { isCollectionItem: false, optionName: "aiAssistant" }, column: { isCollectionItem: true, optionName: "columns" }, columnChooser: { isCollectionItem: false, optionName: "columnChooser" }, columnFixing: { isCollectionItem: false, optionName: "columnFixing" }, + dataGridEditing: { isCollectionItem: false, optionName: "editing" }, dataGridHeaderFilter: { isCollectionItem: false, optionName: "headerFilter" }, dataGridSelection: { isCollectionItem: false, optionName: "selection" }, editing: { isCollectionItem: false, optionName: "editing" }, @@ -719,6 +788,35 @@ const DxAI = defineComponent(DxAIConfig); editorOptions: { isCollectionItem: false, optionName: "editorOptions" } }; +const DxAIAssistantConfig = { + emits: { + "update:isActive": null, + "update:hoveredElement": null, + "update:aiIntegration": null, + "update:chat": null, + "update:enabled": null, + "update:popup": null, + "update:title": null, + }, + props: { + aiIntegration: Object as PropType, + chat: Object as PropType>, + enabled: Boolean, + popup: Object as PropType | Record>, + title: String + } +}; + +prepareConfigurationComponentConfig(DxAIAssistantConfig); + +const DxAIAssistant = defineComponent(DxAIAssistantConfig); + +(DxAIAssistant as any).$_optionName = "aiAssistant"; +(DxAIAssistant as any).$_expectedChildren = { + chat: { isCollectionItem: false, optionName: "chat" }, + popup: { isCollectionItem: false, optionName: "popup" } +}; + const DxAIOptionsConfig = { emits: { "update:isActive": null, @@ -738,6 +836,26 @@ const DxAIOptions = defineComponent(DxAIOptionsConfig); (DxAIOptions as any).$_optionName = "aiOptions"; +const DxAlertConfig = { + emits: { + "update:isActive": null, + "update:hoveredElement": null, + "update:id": null, + "update:message": null, + }, + props: { + id: [Number, String], + message: String + } +}; + +prepareConfigurationComponentConfig(DxAlertConfig); + +const DxAlert = defineComponent(DxAlertConfig); + +(DxAlert as any).$_optionName = "alerts"; +(DxAlert as any).$_isCollectionItem = true; + const DxAnimationConfig = { emits: { "update:isActive": null, @@ -809,6 +927,49 @@ const DxAt = defineComponent(DxAtConfig); (DxAt as any).$_optionName = "at"; +const DxAttachmentConfig = { + emits: { + "update:isActive": null, + "update:hoveredElement": null, + "update:name": null, + "update:size": null, + }, + props: { + name: String, + size: Number + } +}; + +prepareConfigurationComponentConfig(DxAttachmentConfig); + +const DxAttachment = defineComponent(DxAttachmentConfig); + +(DxAttachment as any).$_optionName = "attachments"; +(DxAttachment as any).$_isCollectionItem = true; + +const DxAuthorConfig = { + emits: { + "update:isActive": null, + "update:hoveredElement": null, + "update:avatarAlt": null, + "update:avatarUrl": null, + "update:id": null, + "update:name": null, + }, + props: { + avatarAlt: String, + avatarUrl: String, + id: [Number, String], + name: String + } +}; + +prepareConfigurationComponentConfig(DxAuthorConfig); + +const DxAuthor = defineComponent(DxAuthorConfig); + +(DxAuthor as any).$_optionName = "author"; + const DxBoundaryOffsetConfig = { emits: { "update:isActive": null, @@ -996,6 +1157,184 @@ const DxChange = defineComponent(DxChangeConfig); (DxChange as any).$_optionName = "changes"; (DxChange as any).$_isCollectionItem = true; +const DxChatConfig = { + emits: { + "update:isActive": null, + "update:hoveredElement": null, + "update:accessKey": null, + "update:activeStateEnabled": null, + "update:alerts": null, + "update:dataSource": null, + "update:dayHeaderFormat": null, + "update:disabled": null, + "update:editing": null, + "update:elementAttr": null, + "update:emptyViewTemplate": null, + "update:fileUploaderOptions": null, + "update:focusStateEnabled": null, + "update:height": null, + "update:hint": null, + "update:hoverStateEnabled": null, + "update:inputFieldText": null, + "update:items": null, + "update:messageTemplate": null, + "update:messageTimestampFormat": null, + "update:onAttachmentDownloadClick": null, + "update:onDisposing": null, + "update:onInitialized": null, + "update:onInputFieldTextChanged": null, + "update:onMessageDeleted": null, + "update:onMessageDeleting": null, + "update:onMessageEditCanceled": null, + "update:onMessageEditingStart": null, + "update:onMessageEntered": null, + "update:onMessageUpdated": null, + "update:onMessageUpdating": null, + "update:onOptionChanged": null, + "update:onTypingEnd": null, + "update:onTypingStart": null, + "update:reloadOnChange": null, + "update:rtlEnabled": null, + "update:sendButtonOptions": null, + "update:showAvatar": null, + "update:showDayHeaders": null, + "update:showMessageTimestamp": null, + "update:showUserName": null, + "update:speechToTextEnabled": null, + "update:speechToTextOptions": null, + "update:typingUsers": null, + "update:user": null, + "update:visible": null, + "update:width": null, + }, + props: { + accessKey: String, + activeStateEnabled: Boolean, + alerts: Array as PropType>, + dataSource: [Array, Object, String] as PropType | DataSource | DataSourceOptions | null | Store | string | Record>, + dayHeaderFormat: [Object, String, Function] as PropType string)) | Record | string>, + disabled: Boolean, + editing: Object as PropType>, + elementAttr: Object as PropType>, + emptyViewTemplate: {}, + fileUploaderOptions: Object as PropType>, + focusStateEnabled: Boolean, + height: [Number, String], + hint: String, + hoverStateEnabled: Boolean, + inputFieldText: String, + items: Array as PropType>, + messageTemplate: {}, + messageTimestampFormat: [Object, String, Function] as PropType string)) | Record | string>, + onAttachmentDownloadClick: Function as PropType<((e: AttachmentDownloadClickEvent) => void)>, + onDisposing: Function as PropType<((e: ChatDisposingEvent) => void)>, + onInitialized: Function as PropType<((e: ChatInitializedEvent) => void)>, + onInputFieldTextChanged: Function as PropType<((e: InputFieldTextChangedEvent) => void)>, + onMessageDeleted: Function as PropType<((e: MessageDeletedEvent) => void)>, + onMessageDeleting: Function as PropType<((e: MessageDeletingEvent) => void)>, + onMessageEditCanceled: Function as PropType<((e: MessageEditCanceledEvent) => void)>, + onMessageEditingStart: Function as PropType<((e: MessageEditingStartEvent) => void)>, + onMessageEntered: Function as PropType<((e: MessageEnteredEvent) => void)>, + onMessageUpdated: Function as PropType<((e: MessageUpdatedEvent) => void)>, + onMessageUpdating: Function as PropType<((e: MessageUpdatingEvent) => void)>, + onOptionChanged: Function as PropType<((e: ChatOptionChangedEvent) => void)>, + onTypingEnd: Function as PropType<((e: TypingEndEvent) => void)>, + onTypingStart: Function as PropType<((e: TypingStartEvent) => void)>, + reloadOnChange: Boolean, + rtlEnabled: Boolean, + sendButtonOptions: Object as PropType>, + showAvatar: Boolean, + showDayHeaders: Boolean, + showMessageTimestamp: Boolean, + showUserName: Boolean, + speechToTextEnabled: Boolean, + speechToTextOptions: Object as PropType>, + typingUsers: Array as PropType>, + user: Object as PropType>, + visible: Boolean, + width: [Number, String] + } +}; + +prepareConfigurationComponentConfig(DxChatConfig); + +const DxChat = defineComponent(DxChatConfig); + +(DxChat as any).$_optionName = "chat"; +(DxChat as any).$_expectedChildren = { + alert: { isCollectionItem: true, optionName: "alerts" }, + chatEditing: { isCollectionItem: false, optionName: "editing" }, + chatItem: { isCollectionItem: true, optionName: "items" }, + dayHeaderFormat: { isCollectionItem: false, optionName: "dayHeaderFormat" }, + editing: { isCollectionItem: false, optionName: "editing" }, + fileUploaderOptions: { isCollectionItem: false, optionName: "fileUploaderOptions" }, + item: { isCollectionItem: true, optionName: "items" }, + messageTimestampFormat: { isCollectionItem: false, optionName: "messageTimestampFormat" }, + sendButtonOptions: { isCollectionItem: false, optionName: "sendButtonOptions" }, + speechToTextOptions: { isCollectionItem: false, optionName: "speechToTextOptions" }, + typingUser: { isCollectionItem: true, optionName: "typingUsers" }, + user: { isCollectionItem: false, optionName: "user" } +}; + +const DxChatEditingConfig = { + emits: { + "update:isActive": null, + "update:hoveredElement": null, + "update:allowDeleting": null, + "update:allowUpdating": null, + }, + props: { + allowDeleting: [Boolean, Function] as PropType boolean))>, + allowUpdating: [Boolean, Function] as PropType boolean))> + } +}; + +prepareConfigurationComponentConfig(DxChatEditingConfig); + +const DxChatEditing = defineComponent(DxChatEditingConfig); + +(DxChatEditing as any).$_optionName = "editing"; + +const DxChatItemConfig = { + emits: { + "update:isActive": null, + "update:hoveredElement": null, + "update:alt": null, + "update:attachments": null, + "update:author": null, + "update:id": null, + "update:isDeleted": null, + "update:isEdited": null, + "update:src": null, + "update:text": null, + "update:timestamp": null, + "update:type": null, + }, + props: { + alt: String, + attachments: Array as PropType>, + author: Object as PropType>, + id: [Number, String], + isDeleted: Boolean, + isEdited: Boolean, + src: String, + text: String, + timestamp: [Date, Number, String], + type: String + } +}; + +prepareConfigurationComponentConfig(DxChatItemConfig); + +const DxChatItem = defineComponent(DxChatItemConfig); + +(DxChatItem as any).$_optionName = "items"; +(DxChatItem as any).$_isCollectionItem = true; +(DxChatItem as any).$_expectedChildren = { + attachment: { isCollectionItem: true, optionName: "attachments" }, + author: { isCollectionItem: false, optionName: "author" } +}; + const DxColCountByScreenConfig = { emits: { "update:isActive": null, @@ -1572,6 +1911,116 @@ const DxCustomRule = defineComponent(DxCustomRuleConfig); type: "custom" }; +const DxCustomSpeechRecognizerConfig = { + emits: { + "update:isActive": null, + "update:hoveredElement": null, + "update:enabled": null, + "update:isListening": null, + }, + props: { + enabled: Boolean, + isListening: Boolean + } +}; + +prepareConfigurationComponentConfig(DxCustomSpeechRecognizerConfig); + +const DxCustomSpeechRecognizer = defineComponent(DxCustomSpeechRecognizerConfig); + +(DxCustomSpeechRecognizer as any).$_optionName = "customSpeechRecognizer"; + +const DxDataGridEditingConfig = { + emits: { + "update:isActive": null, + "update:hoveredElement": null, + "update:allowAdding": null, + "update:allowDeleting": null, + "update:allowUpdating": null, + "update:changes": null, + "update:confirmDelete": null, + "update:editColumnName": null, + "update:editRowKey": null, + "update:form": null, + "update:mode": null, + "update:newRowPosition": null, + "update:popup": null, + "update:refreshMode": null, + "update:selectTextOnEditStart": null, + "update:startEditAction": null, + "update:texts": null, + "update:useIcons": null, + }, + props: { + allowAdding: Boolean, + allowDeleting: [Boolean, Function] as PropType boolean))>, + allowUpdating: [Boolean, Function] as PropType boolean))>, + changes: Array as PropType>, + confirmDelete: Boolean, + editColumnName: String, + editRowKey: {}, + form: Object as PropType>, + mode: String as PropType, + newRowPosition: String as PropType, + popup: Object as PropType | Record>, + refreshMode: String as PropType, + selectTextOnEditStart: Boolean, + startEditAction: String as PropType, + texts: {}, + useIcons: Boolean + } +}; + +prepareConfigurationComponentConfig(DxDataGridEditingConfig); + +const DxDataGridEditing = defineComponent(DxDataGridEditingConfig); + +(DxDataGridEditing as any).$_optionName = "editing"; +(DxDataGridEditing as any).$_expectedChildren = { + change: { isCollectionItem: true, optionName: "changes" }, + dataGridEditingTexts: { isCollectionItem: false, optionName: "texts" }, + form: { isCollectionItem: false, optionName: "form" }, + popup: { isCollectionItem: false, optionName: "popup" }, + texts: { isCollectionItem: false, optionName: "texts" } +}; + +const DxDataGridEditingTextsConfig = { + emits: { + "update:isActive": null, + "update:hoveredElement": null, + "update:addRow": null, + "update:cancelAllChanges": null, + "update:cancelRowChanges": null, + "update:confirmDeleteMessage": null, + "update:confirmDeleteTitle": null, + "update:deleteRow": null, + "update:editRow": null, + "update:saveAllChanges": null, + "update:saveRowChanges": null, + "update:undeleteRow": null, + "update:validationCancelChanges": null, + }, + props: { + addRow: String, + cancelAllChanges: String, + cancelRowChanges: String, + confirmDeleteMessage: String, + confirmDeleteTitle: String, + deleteRow: String, + editRow: String, + saveAllChanges: String, + saveRowChanges: String, + undeleteRow: String, + validationCancelChanges: String + } +}; + +prepareConfigurationComponentConfig(DxDataGridEditingTextsConfig); + +const DxDataGridEditingTexts = defineComponent(DxDataGridEditingTextsConfig); + +(DxDataGridEditingTexts as any).$_optionName = "texts"; + const DxDataGridHeaderFilterConfig = { emits: { "update:isActive": null, @@ -1722,6 +2171,33 @@ const DxDataGridToolbarItem = defineComponent(DxDataGridToolbarItemConfig); (DxDataGridToolbarItem as any).$_optionName = "items"; (DxDataGridToolbarItem as any).$_isCollectionItem = true; +const DxDayHeaderFormatConfig = { + emits: { + "update:isActive": null, + "update:hoveredElement": null, + "update:currency": null, + "update:formatter": null, + "update:parser": null, + "update:precision": null, + "update:type": null, + "update:useCurrencyAccountingStyle": null, + }, + props: { + currency: String, + formatter: Function as PropType<((value: number | Date) => string)>, + parser: Function as PropType<((value: string) => number | Date)>, + precision: Number, + type: String as PropType, + useCurrencyAccountingStyle: Boolean + } +}; + +prepareConfigurationComponentConfig(DxDayHeaderFormatConfig); + +const DxDayHeaderFormat = defineComponent(DxDayHeaderFormatConfig); + +(DxDayHeaderFormat as any).$_optionName = "dayHeaderFormat"; + const DxEditingConfig = { emits: { "update:isActive": null, @@ -1770,49 +2246,11 @@ const DxEditing = defineComponent(DxEditingConfig); (DxEditing as any).$_optionName = "editing"; (DxEditing as any).$_expectedChildren = { change: { isCollectionItem: true, optionName: "changes" }, - editingTexts: { isCollectionItem: false, optionName: "texts" }, + dataGridEditingTexts: { isCollectionItem: false, optionName: "texts" }, form: { isCollectionItem: false, optionName: "form" }, - popup: { isCollectionItem: false, optionName: "popup" }, - texts: { isCollectionItem: false, optionName: "texts" } -}; - -const DxEditingTextsConfig = { - emits: { - "update:isActive": null, - "update:hoveredElement": null, - "update:addRow": null, - "update:cancelAllChanges": null, - "update:cancelRowChanges": null, - "update:confirmDeleteMessage": null, - "update:confirmDeleteTitle": null, - "update:deleteRow": null, - "update:editRow": null, - "update:saveAllChanges": null, - "update:saveRowChanges": null, - "update:undeleteRow": null, - "update:validationCancelChanges": null, - }, - props: { - addRow: String, - cancelAllChanges: String, - cancelRowChanges: String, - confirmDeleteMessage: String, - confirmDeleteTitle: String, - deleteRow: String, - editRow: String, - saveAllChanges: String, - saveRowChanges: String, - undeleteRow: String, - validationCancelChanges: String - } + popup: { isCollectionItem: false, optionName: "popup" } }; -prepareConfigurationComponentConfig(DxEditingTextsConfig); - -const DxEditingTexts = defineComponent(DxEditingTextsConfig); - -(DxEditingTexts as any).$_optionName = "texts"; - const DxEditorOptionsConfig = { emits: { "update:isActive": null, @@ -2141,6 +2579,149 @@ const DxFieldLookup = defineComponent(DxFieldLookupConfig); (DxFieldLookup as any).$_optionName = "lookup"; +const DxFileUploaderOptionsConfig = { + emits: { + "update:isActive": null, + "update:hoveredElement": null, + "update:abortUpload": null, + "update:accept": null, + "update:accessKey": null, + "update:activeStateEnabled": null, + "update:allowCanceling": null, + "update:allowedFileExtensions": null, + "update:chunkSize": null, + "update:dialogTrigger": null, + "update:disabled": null, + "update:dropZone": null, + "update:elementAttr": null, + "update:focusStateEnabled": null, + "update:height": null, + "update:hint": null, + "update:hoverStateEnabled": null, + "update:inputAttr": null, + "update:invalidFileExtensionMessage": null, + "update:invalidMaxFileSizeMessage": null, + "update:invalidMinFileSizeMessage": null, + "update:isDirty": null, + "update:isValid": null, + "update:labelText": null, + "update:maxFileSize": null, + "update:minFileSize": null, + "update:multiple": null, + "update:name": null, + "update:onBeforeSend": null, + "update:onContentReady": null, + "update:onDisposing": null, + "update:onDropZoneEnter": null, + "update:onDropZoneLeave": null, + "update:onFilesUploaded": null, + "update:onInitialized": null, + "update:onOptionChanged": null, + "update:onProgress": null, + "update:onUploadAborted": null, + "update:onUploaded": null, + "update:onUploadError": null, + "update:onUploadStarted": null, + "update:onValueChanged": null, + "update:progress": null, + "update:readOnly": null, + "update:readyToUploadMessage": null, + "update:rtlEnabled": null, + "update:selectButtonText": null, + "update:showFileList": null, + "update:tabIndex": null, + "update:uploadAbortedMessage": null, + "update:uploadButtonText": null, + "update:uploadChunk": null, + "update:uploadCustomData": null, + "update:uploadedMessage": null, + "update:uploadFailedMessage": null, + "update:uploadFile": null, + "update:uploadHeaders": null, + "update:uploadMethod": null, + "update:uploadMode": null, + "update:uploadUrl": null, + "update:validationError": null, + "update:validationErrors": null, + "update:validationStatus": null, + "update:value": null, + "update:visible": null, + "update:width": null, + }, + props: { + abortUpload: Function as PropType<((file: any, uploadInfo?: UploadInfo) => any)>, + accept: String, + accessKey: String, + activeStateEnabled: Boolean, + allowCanceling: Boolean, + allowedFileExtensions: Array as PropType>, + chunkSize: Number, + dialogTrigger: {}, + disabled: Boolean, + dropZone: {}, + elementAttr: Object as PropType>, + focusStateEnabled: Boolean, + height: [Number, String], + hint: String, + hoverStateEnabled: Boolean, + inputAttr: {}, + invalidFileExtensionMessage: String, + invalidMaxFileSizeMessage: String, + invalidMinFileSizeMessage: String, + isDirty: Boolean, + isValid: Boolean, + labelText: String, + maxFileSize: Number, + minFileSize: Number, + multiple: Boolean, + name: String, + onBeforeSend: Function as PropType<((e: BeforeSendEvent) => void)>, + onContentReady: Function as PropType<((e: FileUploaderContentReadyEvent) => void)>, + onDisposing: Function as PropType<((e: FileUploaderDisposingEvent) => void)>, + onDropZoneEnter: Function as PropType<((e: DropZoneEnterEvent) => void)>, + onDropZoneLeave: Function as PropType<((e: DropZoneLeaveEvent) => void)>, + onFilesUploaded: Function as PropType<((e: FilesUploadedEvent) => void)>, + onInitialized: Function as PropType<((e: FileUploaderInitializedEvent) => void)>, + onOptionChanged: Function as PropType<((e: FileUploaderOptionChangedEvent) => void)>, + onProgress: Function as PropType<((e: ProgressEvent) => void)>, + onUploadAborted: Function as PropType<((e: UploadAbortedEvent) => void)>, + onUploaded: Function as PropType<((e: UploadedEvent) => void)>, + onUploadError: Function as PropType<((e: UploadErrorEvent) => void)>, + onUploadStarted: Function as PropType<((e: UploadStartedEvent) => void)>, + onValueChanged: Function as PropType<((e: FileUploaderValueChangedEvent) => void)>, + progress: Number, + readOnly: Boolean, + readyToUploadMessage: String, + rtlEnabled: Boolean, + selectButtonText: String, + showFileList: Boolean, + tabIndex: Number, + uploadAbortedMessage: String, + uploadButtonText: String, + uploadChunk: Function as PropType<((file: any, uploadInfo: UploadInfo) => any)>, + uploadCustomData: {}, + uploadedMessage: String, + uploadFailedMessage: String, + uploadFile: Function as PropType<((file: any, progressCallback: (() => void)) => any)>, + uploadHeaders: {}, + uploadMethod: String as PropType, + uploadMode: String as PropType, + uploadUrl: String, + validationError: {}, + validationErrors: Array as PropType>, + validationStatus: String as PropType, + value: Array as PropType>, + visible: Boolean, + width: [Number, String] + } +}; + +prepareConfigurationComponentConfig(DxFileUploaderOptionsConfig); + +const DxFileUploaderOptions = defineComponent(DxFileUploaderOptionsConfig); + +(DxFileUploaderOptions as any).$_optionName = "fileUploaderOptions"; + const DxFilterBuilderConfig = { emits: { "update:isActive": null, @@ -3003,6 +3584,9 @@ const DxItemConfig = { "update:hoveredElement": null, "update:aiOptions": null, "update:alignItemLabels": null, + "update:alt": null, + "update:attachments": null, + "update:author": null, "update:badge": null, "update:buttonOptions": null, "update:caption": null, @@ -3019,6 +3603,9 @@ const DxItemConfig = { "update:horizontalAlignment": null, "update:html": null, "update:icon": null, + "update:id": null, + "update:isDeleted": null, + "update:isEdited": null, "update:isRequired": null, "update:items": null, "update:itemType": null, @@ -3029,12 +3616,15 @@ const DxItemConfig = { "update:name": null, "update:options": null, "update:showText": null, + "update:src": null, "update:tabPanelOptions": null, "update:tabs": null, "update:tabTemplate": null, "update:template": null, "update:text": null, + "update:timestamp": null, "update:title": null, + "update:type": null, "update:validationRules": null, "update:verticalAlignment": null, "update:visible": null, @@ -3044,6 +3634,9 @@ const DxItemConfig = { props: { aiOptions: Object as PropType>, alignItemLabels: Boolean, + alt: String, + attachments: Array as PropType>, + author: Object as PropType>, badge: String, buttonOptions: Object as PropType>, caption: String, @@ -3060,6 +3653,9 @@ const DxItemConfig = { horizontalAlignment: String as PropType, html: String, icon: String, + id: [Number, String], + isDeleted: Boolean, + isEdited: Boolean, isRequired: Boolean, items: Array as PropType>, itemType: String as PropType, @@ -3070,12 +3666,15 @@ const DxItemConfig = { name: String as PropType, options: {}, showText: String as PropType, + src: String, tabPanelOptions: Object as PropType>, tabs: Array as PropType>>, tabTemplate: {}, template: {}, text: String, + timestamp: [Date, Number, String], title: String, + type: String, validationRules: Array as PropType>, verticalAlignment: String as PropType, visible: Boolean, @@ -3093,6 +3692,8 @@ const DxItem = defineComponent(DxItemConfig); (DxItem as any).$_expectedChildren = { aiOptions: { isCollectionItem: false, optionName: "aiOptions" }, AsyncRule: { isCollectionItem: true, optionName: "validationRules" }, + attachment: { isCollectionItem: true, optionName: "attachments" }, + author: { isCollectionItem: false, optionName: "author" }, buttonOptions: { isCollectionItem: false, optionName: "buttonOptions" }, colCountByScreen: { isCollectionItem: false, optionName: "colCountByScreen" }, CompareRule: { isCollectionItem: true, optionName: "validationRules" }, @@ -3243,6 +3844,33 @@ const DxMasterDetail = defineComponent(DxMasterDetailConfig); (DxMasterDetail as any).$_optionName = "masterDetail"; +const DxMessageTimestampFormatConfig = { + emits: { + "update:isActive": null, + "update:hoveredElement": null, + "update:currency": null, + "update:formatter": null, + "update:parser": null, + "update:precision": null, + "update:type": null, + "update:useCurrencyAccountingStyle": null, + }, + props: { + currency: String, + formatter: Function as PropType<((value: number | Date) => string)>, + parser: Function as PropType<((value: string) => number | Date)>, + precision: Number, + type: String as PropType, + useCurrencyAccountingStyle: Boolean + } +}; + +prepareConfigurationComponentConfig(DxMessageTimestampFormatConfig); + +const DxMessageTimestampFormat = defineComponent(DxMessageTimestampFormatConfig); + +(DxMessageTimestampFormat as any).$_optionName = "messageTimestampFormat"; + const DxMyConfig = { emits: { "update:isActive": null, @@ -3904,6 +4532,27 @@ const DxSelection = defineComponent(DxSelectionConfig); (DxSelection as any).$_optionName = "selection"; +const DxSendButtonOptionsConfig = { + emits: { + "update:isActive": null, + "update:hoveredElement": null, + "update:action": null, + "update:icon": null, + "update:onClick": null, + }, + props: { + action: String as PropType, + icon: String, + onClick: Function as PropType<((e: SendButtonClickEvent) => void)> + } +}; + +prepareConfigurationComponentConfig(DxSendButtonOptionsConfig); + +const DxSendButtonOptions = defineComponent(DxSendButtonOptionsConfig); + +(DxSendButtonOptions as any).$_optionName = "sendButtonOptions"; + const DxShowConfig = { emits: { "update:isActive": null, @@ -4053,6 +4702,108 @@ const DxSorting = defineComponent(DxSortingConfig); (DxSorting as any).$_optionName = "sorting"; +const DxSpeechRecognitionConfigConfig = { + emits: { + "update:isActive": null, + "update:hoveredElement": null, + "update:continuous": null, + "update:grammars": null, + "update:interimResults": null, + "update:lang": null, + "update:maxAlternatives": null, + }, + props: { + continuous: Boolean, + grammars: Array as PropType>, + interimResults: Boolean, + lang: String, + maxAlternatives: Number + } +}; + +prepareConfigurationComponentConfig(DxSpeechRecognitionConfigConfig); + +const DxSpeechRecognitionConfig = defineComponent(DxSpeechRecognitionConfigConfig); + +(DxSpeechRecognitionConfig as any).$_optionName = "speechRecognitionConfig"; + +const DxSpeechToTextOptionsConfig = { + emits: { + "update:isActive": null, + "update:hoveredElement": null, + "update:accessKey": null, + "update:activeStateEnabled": null, + "update:customSpeechRecognizer": null, + "update:disabled": null, + "update:elementAttr": null, + "update:focusStateEnabled": null, + "update:height": null, + "update:hint": null, + "update:hoverStateEnabled": null, + "update:onContentReady": null, + "update:onDisposing": null, + "update:onEnd": null, + "update:onError": null, + "update:onInitialized": null, + "update:onOptionChanged": null, + "update:onResult": null, + "update:onStartClick": null, + "update:onStopClick": null, + "update:rtlEnabled": null, + "update:speechRecognitionConfig": null, + "update:startIcon": null, + "update:startText": null, + "update:stopIcon": null, + "update:stopText": null, + "update:stylingMode": null, + "update:tabIndex": null, + "update:type": null, + "update:visible": null, + "update:width": null, + }, + props: { + accessKey: String, + activeStateEnabled: Boolean, + customSpeechRecognizer: Object as PropType>, + disabled: Boolean, + elementAttr: Object as PropType>, + focusStateEnabled: Boolean, + height: [Number, String], + hint: String, + hoverStateEnabled: Boolean, + onContentReady: Function as PropType<((e: SpeechToTextContentReadyEvent) => void)>, + onDisposing: Function as PropType<((e: SpeechToTextDisposingEvent) => void)>, + onEnd: Function as PropType<((e: EndEvent) => void)>, + onError: Function as PropType<((e: ErrorEvent) => void)>, + onInitialized: Function as PropType<((e: SpeechToTextInitializedEvent) => void)>, + onOptionChanged: Function as PropType<((e: SpeechToTextOptionChangedEvent) => void)>, + onResult: Function as PropType<((e: ResultEvent) => void)>, + onStartClick: Function as PropType<((e: StartClickEvent) => void)>, + onStopClick: Function as PropType<((e: StopClickEvent) => void)>, + rtlEnabled: Boolean, + speechRecognitionConfig: Object as PropType | SpeechRecognitionConfig>, + startIcon: String, + startText: String, + stopIcon: String, + stopText: String, + stylingMode: String as PropType, + tabIndex: Number, + type: String as PropType, + visible: Boolean, + width: [Number, String] + } +}; + +prepareConfigurationComponentConfig(DxSpeechToTextOptionsConfig); + +const DxSpeechToTextOptions = defineComponent(DxSpeechToTextOptionsConfig); + +(DxSpeechToTextOptions as any).$_optionName = "speechToTextOptions"; +(DxSpeechToTextOptions as any).$_expectedChildren = { + customSpeechRecognizer: { isCollectionItem: false, optionName: "customSpeechRecognizer" }, + speechRecognitionConfig: { isCollectionItem: false, optionName: "speechRecognitionConfig" } +}; + const DxStateStoringConfig = { emits: { "update:isActive": null, @@ -4625,6 +5376,53 @@ const DxTotalItem = defineComponent(DxTotalItemConfig); valueFormat: { isCollectionItem: false, optionName: "valueFormat" } }; +const DxTypingUserConfig = { + emits: { + "update:isActive": null, + "update:hoveredElement": null, + "update:avatarAlt": null, + "update:avatarUrl": null, + "update:id": null, + "update:name": null, + }, + props: { + avatarAlt: String, + avatarUrl: String, + id: [Number, String], + name: String + } +}; + +prepareConfigurationComponentConfig(DxTypingUserConfig); + +const DxTypingUser = defineComponent(DxTypingUserConfig); + +(DxTypingUser as any).$_optionName = "typingUsers"; +(DxTypingUser as any).$_isCollectionItem = true; + +const DxUserConfig = { + emits: { + "update:isActive": null, + "update:hoveredElement": null, + "update:avatarAlt": null, + "update:avatarUrl": null, + "update:id": null, + "update:name": null, + }, + props: { + avatarAlt: String, + avatarUrl: String, + id: [Number, String], + name: String + } +}; + +prepareConfigurationComponentConfig(DxUserConfig); + +const DxUser = defineComponent(DxUserConfig); + +(DxUser as any).$_optionName = "user"; + const DxValidationRuleConfig = { emits: { "update:isActive": null, @@ -4697,15 +5495,22 @@ export default DxDataGrid; export { DxDataGrid, DxAI, + DxAIAssistant, DxAIOptions, + DxAlert, DxAnimation, DxAsyncRule, DxAt, + DxAttachment, + DxAuthor, DxBoundaryOffset, DxButton, DxButtonItem, DxButtonOptions, DxChange, + DxChat, + DxChatEditing, + DxChatItem, DxColCountByScreen, DxCollision, DxColumn, @@ -4722,13 +5527,16 @@ export { DxCursorOffset, DxCustomOperation, DxCustomRule, + DxCustomSpeechRecognizer, + DxDataGridEditing, + DxDataGridEditingTexts, DxDataGridHeaderFilter, DxDataGridHeaderFilterSearch, DxDataGridHeaderFilterTexts, DxDataGridSelection, DxDataGridToolbarItem, + DxDayHeaderFormat, DxEditing, - DxEditingTexts, DxEditorOptions, DxEditorOptionsButton, DxEmailRule, @@ -4737,6 +5545,7 @@ export { DxExportTexts, DxField, DxFieldLookup, + DxFileUploaderOptions, DxFilterBuilder, DxFilterBuilderPopup, DxFilterOperationDescriptions, @@ -4763,6 +5572,7 @@ export { DxLoadPanel, DxLookup, DxMasterDetail, + DxMessageTimestampFormat, DxMy, DxNumericRule, DxOffset, @@ -4781,10 +5591,13 @@ export { DxSearch, DxSearchPanel, DxSelection, + DxSendButtonOptions, DxShow, DxSimpleItem, DxSortByGroupSummaryInfo, DxSorting, + DxSpeechRecognitionConfig, + DxSpeechToTextOptions, DxStateStoring, DxStringLengthRule, DxSummary, @@ -4798,6 +5611,8 @@ export { DxToolbar, DxToolbarItem, DxTotalItem, + DxTypingUser, + DxUser, DxValidationRule, DxValueFormat }; diff --git a/packages/devextreme-vue/src/tree-list.ts b/packages/devextreme-vue/src/tree-list.ts index 890d50a06aae..8210dbadc766 100644 --- a/packages/devextreme-vue/src/tree-list.ts +++ b/packages/devextreme-vue/src/tree-list.ts @@ -5,15 +5,15 @@ import { prepareComponentConfig } from "./core/index"; import TreeList, { Properties } from "devextreme/ui/tree_list"; import DataSource from "devextreme/data/data_source"; import dxTreeList from "devextreme/ui/tree_list"; +import dxChat from "devextreme/ui/chat"; +import UploadInfo from "devextreme/file_management/upload_info"; import dxOverlay from "devextreme/ui/overlay"; import DOMComponent from "devextreme/core/dom_component"; import dxPopup from "devextreme/ui/popup"; import dxSortable from "devextreme/ui/sortable"; import dxDraggable from "devextreme/ui/draggable"; import { - AIIntegration, -} from "devextreme/common/ai-integration"; -import { + AIAssistant, ColumnChooser, ColumnResizeMode, FilterPanel, @@ -49,10 +49,14 @@ import { DataRenderMode, StateStoreType, } from "devextreme/common/grids"; +import { + AIIntegration, +} from "devextreme/common/ai-integration"; import { dxTreeListColumn, TreeListFilterMode, AdaptiveDetailRowPreparingEvent, + AIAssistantRequestCreatingEvent, AIColumnRequestCreatingEvent, CellClickEvent, CellDblClickEvent, @@ -112,8 +116,8 @@ import { TextEditorButtonLocation, ButtonStyle, ButtonType, - DataType, Format as CommonFormat, + DataType, SortOrder, SearchMode, ComparisonOperator, @@ -186,6 +190,30 @@ import { PasteEvent, ValueChangedEvent, } from "devextreme/ui/text_box"; +import { + dxChatOptions, + Alert, + Message, + AttachmentDownloadClickEvent, + DisposingEvent as ChatDisposingEvent, + InitializedEvent as ChatInitializedEvent, + InputFieldTextChangedEvent, + MessageDeletedEvent, + MessageDeletingEvent, + MessageEditCanceledEvent, + MessageEditingStartEvent, + MessageEnteredEvent, + MessageUpdatedEvent, + MessageUpdatingEvent, + OptionChangedEvent as ChatOptionChangedEvent, + TypingEndEvent, + TypingStartEvent, + SendButtonProperties, + User, + Attachment, + SendButtonAction, + SendButtonClickEvent, +} from "devextreme/ui/chat"; import { AnimationConfig, CollisionResolution, @@ -226,6 +254,39 @@ import { import { Format, } from "devextreme/common/core/localization"; +import { + dxFileUploaderOptions, + BeforeSendEvent, + ContentReadyEvent as FileUploaderContentReadyEvent, + DisposingEvent as FileUploaderDisposingEvent, + DropZoneEnterEvent, + DropZoneLeaveEvent, + FilesUploadedEvent, + InitializedEvent as FileUploaderInitializedEvent, + OptionChangedEvent as FileUploaderOptionChangedEvent, + ProgressEvent, + UploadAbortedEvent, + UploadedEvent, + UploadErrorEvent, + UploadStartedEvent, + ValueChangedEvent as FileUploaderValueChangedEvent, + UploadHttpMethod, + FileUploadMode, +} from "devextreme/ui/file_uploader"; +import { + dxSpeechToTextOptions, + CustomSpeechRecognizer, + ContentReadyEvent as SpeechToTextContentReadyEvent, + DisposingEvent as SpeechToTextDisposingEvent, + EndEvent, + ErrorEvent, + InitializedEvent as SpeechToTextInitializedEvent, + OptionChangedEvent as SpeechToTextOptionChangedEvent, + ResultEvent, + StartClickEvent, + StopClickEvent, + SpeechRecognitionConfig, +} from "devextreme/ui/speech_to_text"; import { event, } from "devextreme/events/events.types"; @@ -268,6 +329,7 @@ import { prepareConfigurationComponentConfig } from "./core/index"; type AccessibleOptions = Pick>, aiIntegration: Object as PropType, allowColumnReordering: Boolean, allowColumnResizing: Boolean, @@ -442,6 +506,7 @@ const componentConfig = { loadPanel: Object as PropType>, noDataText: String, onAdaptiveDetailRowPreparing: Function as PropType<((e: AdaptiveDetailRowPreparingEvent) => void)>, + onAIAssistantRequestCreating: Function as PropType<((e: AIAssistantRequestCreatingEvent) => void)>, onAIColumnRequestCreating: Function as PropType<((e: AIColumnRequestCreatingEvent) => void)>, onCellClick: Function as PropType<((e: CellClickEvent) => void)>, onCellDblClick: Function as PropType<((e: CellDblClickEvent) => void)>, @@ -516,6 +581,7 @@ const componentConfig = { "update:hoveredElement": null, "update:accessKey": null, "update:activeStateEnabled": null, + "update:aiAssistant": null, "update:aiIntegration": null, "update:allowColumnReordering": null, "update:allowColumnResizing": null, @@ -564,6 +630,7 @@ const componentConfig = { "update:loadPanel": null, "update:noDataText": null, "update:onAdaptiveDetailRowPreparing": null, + "update:onAIAssistantRequestCreating": null, "update:onAIColumnRequestCreating": null, "update:onCellClick": null, "update:onCellDblClick": null, @@ -642,6 +709,7 @@ const componentConfig = { (this as any).$_WidgetClass = TreeList; (this as any).$_hasAsyncTemplate = false; (this as any).$_expectedChildren = { + aiAssistant: { isCollectionItem: false, optionName: "aiAssistant" }, column: { isCollectionItem: true, optionName: "columns" }, columnChooser: { isCollectionItem: false, optionName: "columnChooser" }, columnFixing: { isCollectionItem: false, optionName: "columnFixing" }, @@ -663,6 +731,7 @@ const componentConfig = { sorting: { isCollectionItem: false, optionName: "sorting" }, stateStoring: { isCollectionItem: false, optionName: "stateStoring" }, toolbar: { isCollectionItem: false, optionName: "toolbar" }, + treeListEditing: { isCollectionItem: false, optionName: "editing" }, treeListHeaderFilter: { isCollectionItem: false, optionName: "headerFilter" }, treeListSelection: { isCollectionItem: false, optionName: "selection" } }; @@ -708,6 +777,35 @@ const DxAI = defineComponent(DxAIConfig); editorOptions: { isCollectionItem: false, optionName: "editorOptions" } }; +const DxAIAssistantConfig = { + emits: { + "update:isActive": null, + "update:hoveredElement": null, + "update:aiIntegration": null, + "update:chat": null, + "update:enabled": null, + "update:popup": null, + "update:title": null, + }, + props: { + aiIntegration: Object as PropType, + chat: Object as PropType>, + enabled: Boolean, + popup: Object as PropType | Record>, + title: String + } +}; + +prepareConfigurationComponentConfig(DxAIAssistantConfig); + +const DxAIAssistant = defineComponent(DxAIAssistantConfig); + +(DxAIAssistant as any).$_optionName = "aiAssistant"; +(DxAIAssistant as any).$_expectedChildren = { + chat: { isCollectionItem: false, optionName: "chat" }, + popup: { isCollectionItem: false, optionName: "popup" } +}; + const DxAIOptionsConfig = { emits: { "update:isActive": null, @@ -727,6 +825,26 @@ const DxAIOptions = defineComponent(DxAIOptionsConfig); (DxAIOptions as any).$_optionName = "aiOptions"; +const DxAlertConfig = { + emits: { + "update:isActive": null, + "update:hoveredElement": null, + "update:id": null, + "update:message": null, + }, + props: { + id: [Number, String], + message: String + } +}; + +prepareConfigurationComponentConfig(DxAlertConfig); + +const DxAlert = defineComponent(DxAlertConfig); + +(DxAlert as any).$_optionName = "alerts"; +(DxAlert as any).$_isCollectionItem = true; + const DxAnimationConfig = { emits: { "update:isActive": null, @@ -798,6 +916,49 @@ const DxAt = defineComponent(DxAtConfig); (DxAt as any).$_optionName = "at"; +const DxAttachmentConfig = { + emits: { + "update:isActive": null, + "update:hoveredElement": null, + "update:name": null, + "update:size": null, + }, + props: { + name: String, + size: Number + } +}; + +prepareConfigurationComponentConfig(DxAttachmentConfig); + +const DxAttachment = defineComponent(DxAttachmentConfig); + +(DxAttachment as any).$_optionName = "attachments"; +(DxAttachment as any).$_isCollectionItem = true; + +const DxAuthorConfig = { + emits: { + "update:isActive": null, + "update:hoveredElement": null, + "update:avatarAlt": null, + "update:avatarUrl": null, + "update:id": null, + "update:name": null, + }, + props: { + avatarAlt: String, + avatarUrl: String, + id: [Number, String], + name: String + } +}; + +prepareConfigurationComponentConfig(DxAuthorConfig); + +const DxAuthor = defineComponent(DxAuthorConfig); + +(DxAuthor as any).$_optionName = "author"; + const DxBoundaryOffsetConfig = { emits: { "update:isActive": null, @@ -985,6 +1146,184 @@ const DxChange = defineComponent(DxChangeConfig); (DxChange as any).$_optionName = "changes"; (DxChange as any).$_isCollectionItem = true; +const DxChatConfig = { + emits: { + "update:isActive": null, + "update:hoveredElement": null, + "update:accessKey": null, + "update:activeStateEnabled": null, + "update:alerts": null, + "update:dataSource": null, + "update:dayHeaderFormat": null, + "update:disabled": null, + "update:editing": null, + "update:elementAttr": null, + "update:emptyViewTemplate": null, + "update:fileUploaderOptions": null, + "update:focusStateEnabled": null, + "update:height": null, + "update:hint": null, + "update:hoverStateEnabled": null, + "update:inputFieldText": null, + "update:items": null, + "update:messageTemplate": null, + "update:messageTimestampFormat": null, + "update:onAttachmentDownloadClick": null, + "update:onDisposing": null, + "update:onInitialized": null, + "update:onInputFieldTextChanged": null, + "update:onMessageDeleted": null, + "update:onMessageDeleting": null, + "update:onMessageEditCanceled": null, + "update:onMessageEditingStart": null, + "update:onMessageEntered": null, + "update:onMessageUpdated": null, + "update:onMessageUpdating": null, + "update:onOptionChanged": null, + "update:onTypingEnd": null, + "update:onTypingStart": null, + "update:reloadOnChange": null, + "update:rtlEnabled": null, + "update:sendButtonOptions": null, + "update:showAvatar": null, + "update:showDayHeaders": null, + "update:showMessageTimestamp": null, + "update:showUserName": null, + "update:speechToTextEnabled": null, + "update:speechToTextOptions": null, + "update:typingUsers": null, + "update:user": null, + "update:visible": null, + "update:width": null, + }, + props: { + accessKey: String, + activeStateEnabled: Boolean, + alerts: Array as PropType>, + dataSource: [Array, Object, String] as PropType | DataSource | DataSourceOptions | null | Store | string | Record>, + dayHeaderFormat: [Object, String, Function] as PropType string)) | Record | string>, + disabled: Boolean, + editing: Object as PropType>, + elementAttr: Object as PropType>, + emptyViewTemplate: {}, + fileUploaderOptions: Object as PropType>, + focusStateEnabled: Boolean, + height: [Number, String], + hint: String, + hoverStateEnabled: Boolean, + inputFieldText: String, + items: Array as PropType>, + messageTemplate: {}, + messageTimestampFormat: [Object, String, Function] as PropType string)) | Record | string>, + onAttachmentDownloadClick: Function as PropType<((e: AttachmentDownloadClickEvent) => void)>, + onDisposing: Function as PropType<((e: ChatDisposingEvent) => void)>, + onInitialized: Function as PropType<((e: ChatInitializedEvent) => void)>, + onInputFieldTextChanged: Function as PropType<((e: InputFieldTextChangedEvent) => void)>, + onMessageDeleted: Function as PropType<((e: MessageDeletedEvent) => void)>, + onMessageDeleting: Function as PropType<((e: MessageDeletingEvent) => void)>, + onMessageEditCanceled: Function as PropType<((e: MessageEditCanceledEvent) => void)>, + onMessageEditingStart: Function as PropType<((e: MessageEditingStartEvent) => void)>, + onMessageEntered: Function as PropType<((e: MessageEnteredEvent) => void)>, + onMessageUpdated: Function as PropType<((e: MessageUpdatedEvent) => void)>, + onMessageUpdating: Function as PropType<((e: MessageUpdatingEvent) => void)>, + onOptionChanged: Function as PropType<((e: ChatOptionChangedEvent) => void)>, + onTypingEnd: Function as PropType<((e: TypingEndEvent) => void)>, + onTypingStart: Function as PropType<((e: TypingStartEvent) => void)>, + reloadOnChange: Boolean, + rtlEnabled: Boolean, + sendButtonOptions: Object as PropType>, + showAvatar: Boolean, + showDayHeaders: Boolean, + showMessageTimestamp: Boolean, + showUserName: Boolean, + speechToTextEnabled: Boolean, + speechToTextOptions: Object as PropType>, + typingUsers: Array as PropType>, + user: Object as PropType>, + visible: Boolean, + width: [Number, String] + } +}; + +prepareConfigurationComponentConfig(DxChatConfig); + +const DxChat = defineComponent(DxChatConfig); + +(DxChat as any).$_optionName = "chat"; +(DxChat as any).$_expectedChildren = { + alert: { isCollectionItem: true, optionName: "alerts" }, + chatEditing: { isCollectionItem: false, optionName: "editing" }, + chatItem: { isCollectionItem: true, optionName: "items" }, + dayHeaderFormat: { isCollectionItem: false, optionName: "dayHeaderFormat" }, + editing: { isCollectionItem: false, optionName: "editing" }, + fileUploaderOptions: { isCollectionItem: false, optionName: "fileUploaderOptions" }, + item: { isCollectionItem: true, optionName: "items" }, + messageTimestampFormat: { isCollectionItem: false, optionName: "messageTimestampFormat" }, + sendButtonOptions: { isCollectionItem: false, optionName: "sendButtonOptions" }, + speechToTextOptions: { isCollectionItem: false, optionName: "speechToTextOptions" }, + typingUser: { isCollectionItem: true, optionName: "typingUsers" }, + user: { isCollectionItem: false, optionName: "user" } +}; + +const DxChatEditingConfig = { + emits: { + "update:isActive": null, + "update:hoveredElement": null, + "update:allowDeleting": null, + "update:allowUpdating": null, + }, + props: { + allowDeleting: [Boolean, Function] as PropType boolean))>, + allowUpdating: [Boolean, Function] as PropType boolean))> + } +}; + +prepareConfigurationComponentConfig(DxChatEditingConfig); + +const DxChatEditing = defineComponent(DxChatEditingConfig); + +(DxChatEditing as any).$_optionName = "editing"; + +const DxChatItemConfig = { + emits: { + "update:isActive": null, + "update:hoveredElement": null, + "update:alt": null, + "update:attachments": null, + "update:author": null, + "update:id": null, + "update:isDeleted": null, + "update:isEdited": null, + "update:src": null, + "update:text": null, + "update:timestamp": null, + "update:type": null, + }, + props: { + alt: String, + attachments: Array as PropType>, + author: Object as PropType>, + id: [Number, String], + isDeleted: Boolean, + isEdited: Boolean, + src: String, + text: String, + timestamp: [Date, Number, String], + type: String + } +}; + +prepareConfigurationComponentConfig(DxChatItemConfig); + +const DxChatItem = defineComponent(DxChatItemConfig); + +(DxChatItem as any).$_optionName = "items"; +(DxChatItem as any).$_isCollectionItem = true; +(DxChatItem as any).$_expectedChildren = { + attachment: { isCollectionItem: true, optionName: "attachments" }, + author: { isCollectionItem: false, optionName: "author" } +}; + const DxColCountByScreenConfig = { emits: { "update:isActive": null, @@ -1547,6 +1886,52 @@ const DxCustomRule = defineComponent(DxCustomRuleConfig); type: "custom" }; +const DxCustomSpeechRecognizerConfig = { + emits: { + "update:isActive": null, + "update:hoveredElement": null, + "update:enabled": null, + "update:isListening": null, + }, + props: { + enabled: Boolean, + isListening: Boolean + } +}; + +prepareConfigurationComponentConfig(DxCustomSpeechRecognizerConfig); + +const DxCustomSpeechRecognizer = defineComponent(DxCustomSpeechRecognizerConfig); + +(DxCustomSpeechRecognizer as any).$_optionName = "customSpeechRecognizer"; + +const DxDayHeaderFormatConfig = { + emits: { + "update:isActive": null, + "update:hoveredElement": null, + "update:currency": null, + "update:formatter": null, + "update:parser": null, + "update:precision": null, + "update:type": null, + "update:useCurrencyAccountingStyle": null, + }, + props: { + currency: String, + formatter: Function as PropType<((value: number | Date) => string)>, + parser: Function as PropType<((value: string) => number | Date)>, + precision: Number, + type: String as PropType, + useCurrencyAccountingStyle: Boolean + } +}; + +prepareConfigurationComponentConfig(DxDayHeaderFormatConfig); + +const DxDayHeaderFormat = defineComponent(DxDayHeaderFormatConfig); + +(DxDayHeaderFormat as any).$_optionName = "dayHeaderFormat"; + const DxEditingConfig = { emits: { "update:isActive": null, @@ -1593,51 +1978,11 @@ const DxEditing = defineComponent(DxEditingConfig); (DxEditing as any).$_optionName = "editing"; (DxEditing as any).$_expectedChildren = { change: { isCollectionItem: true, optionName: "changes" }, - editingTexts: { isCollectionItem: false, optionName: "texts" }, form: { isCollectionItem: false, optionName: "form" }, popup: { isCollectionItem: false, optionName: "popup" }, - texts: { isCollectionItem: false, optionName: "texts" } + treeListEditingTexts: { isCollectionItem: false, optionName: "texts" } }; -const DxEditingTextsConfig = { - emits: { - "update:isActive": null, - "update:hoveredElement": null, - "update:addRow": null, - "update:addRowToNode": null, - "update:cancelAllChanges": null, - "update:cancelRowChanges": null, - "update:confirmDeleteMessage": null, - "update:confirmDeleteTitle": null, - "update:deleteRow": null, - "update:editRow": null, - "update:saveAllChanges": null, - "update:saveRowChanges": null, - "update:undeleteRow": null, - "update:validationCancelChanges": null, - }, - props: { - addRow: String, - addRowToNode: String, - cancelAllChanges: String, - cancelRowChanges: String, - confirmDeleteMessage: String, - confirmDeleteTitle: String, - deleteRow: String, - editRow: String, - saveAllChanges: String, - saveRowChanges: String, - undeleteRow: String, - validationCancelChanges: String - } -}; - -prepareConfigurationComponentConfig(DxEditingTextsConfig); - -const DxEditingTexts = defineComponent(DxEditingTextsConfig); - -(DxEditingTexts as any).$_optionName = "texts"; - const DxEditorOptionsConfig = { emits: { "update:isActive": null, @@ -1918,6 +2263,149 @@ const DxFieldLookup = defineComponent(DxFieldLookupConfig); (DxFieldLookup as any).$_optionName = "lookup"; +const DxFileUploaderOptionsConfig = { + emits: { + "update:isActive": null, + "update:hoveredElement": null, + "update:abortUpload": null, + "update:accept": null, + "update:accessKey": null, + "update:activeStateEnabled": null, + "update:allowCanceling": null, + "update:allowedFileExtensions": null, + "update:chunkSize": null, + "update:dialogTrigger": null, + "update:disabled": null, + "update:dropZone": null, + "update:elementAttr": null, + "update:focusStateEnabled": null, + "update:height": null, + "update:hint": null, + "update:hoverStateEnabled": null, + "update:inputAttr": null, + "update:invalidFileExtensionMessage": null, + "update:invalidMaxFileSizeMessage": null, + "update:invalidMinFileSizeMessage": null, + "update:isDirty": null, + "update:isValid": null, + "update:labelText": null, + "update:maxFileSize": null, + "update:minFileSize": null, + "update:multiple": null, + "update:name": null, + "update:onBeforeSend": null, + "update:onContentReady": null, + "update:onDisposing": null, + "update:onDropZoneEnter": null, + "update:onDropZoneLeave": null, + "update:onFilesUploaded": null, + "update:onInitialized": null, + "update:onOptionChanged": null, + "update:onProgress": null, + "update:onUploadAborted": null, + "update:onUploaded": null, + "update:onUploadError": null, + "update:onUploadStarted": null, + "update:onValueChanged": null, + "update:progress": null, + "update:readOnly": null, + "update:readyToUploadMessage": null, + "update:rtlEnabled": null, + "update:selectButtonText": null, + "update:showFileList": null, + "update:tabIndex": null, + "update:uploadAbortedMessage": null, + "update:uploadButtonText": null, + "update:uploadChunk": null, + "update:uploadCustomData": null, + "update:uploadedMessage": null, + "update:uploadFailedMessage": null, + "update:uploadFile": null, + "update:uploadHeaders": null, + "update:uploadMethod": null, + "update:uploadMode": null, + "update:uploadUrl": null, + "update:validationError": null, + "update:validationErrors": null, + "update:validationStatus": null, + "update:value": null, + "update:visible": null, + "update:width": null, + }, + props: { + abortUpload: Function as PropType<((file: any, uploadInfo?: UploadInfo) => any)>, + accept: String, + accessKey: String, + activeStateEnabled: Boolean, + allowCanceling: Boolean, + allowedFileExtensions: Array as PropType>, + chunkSize: Number, + dialogTrigger: {}, + disabled: Boolean, + dropZone: {}, + elementAttr: Object as PropType>, + focusStateEnabled: Boolean, + height: [Number, String], + hint: String, + hoverStateEnabled: Boolean, + inputAttr: {}, + invalidFileExtensionMessage: String, + invalidMaxFileSizeMessage: String, + invalidMinFileSizeMessage: String, + isDirty: Boolean, + isValid: Boolean, + labelText: String, + maxFileSize: Number, + minFileSize: Number, + multiple: Boolean, + name: String, + onBeforeSend: Function as PropType<((e: BeforeSendEvent) => void)>, + onContentReady: Function as PropType<((e: FileUploaderContentReadyEvent) => void)>, + onDisposing: Function as PropType<((e: FileUploaderDisposingEvent) => void)>, + onDropZoneEnter: Function as PropType<((e: DropZoneEnterEvent) => void)>, + onDropZoneLeave: Function as PropType<((e: DropZoneLeaveEvent) => void)>, + onFilesUploaded: Function as PropType<((e: FilesUploadedEvent) => void)>, + onInitialized: Function as PropType<((e: FileUploaderInitializedEvent) => void)>, + onOptionChanged: Function as PropType<((e: FileUploaderOptionChangedEvent) => void)>, + onProgress: Function as PropType<((e: ProgressEvent) => void)>, + onUploadAborted: Function as PropType<((e: UploadAbortedEvent) => void)>, + onUploaded: Function as PropType<((e: UploadedEvent) => void)>, + onUploadError: Function as PropType<((e: UploadErrorEvent) => void)>, + onUploadStarted: Function as PropType<((e: UploadStartedEvent) => void)>, + onValueChanged: Function as PropType<((e: FileUploaderValueChangedEvent) => void)>, + progress: Number, + readOnly: Boolean, + readyToUploadMessage: String, + rtlEnabled: Boolean, + selectButtonText: String, + showFileList: Boolean, + tabIndex: Number, + uploadAbortedMessage: String, + uploadButtonText: String, + uploadChunk: Function as PropType<((file: any, uploadInfo: UploadInfo) => any)>, + uploadCustomData: {}, + uploadedMessage: String, + uploadFailedMessage: String, + uploadFile: Function as PropType<((file: any, progressCallback: (() => void)) => any)>, + uploadHeaders: {}, + uploadMethod: String as PropType, + uploadMode: String as PropType, + uploadUrl: String, + validationError: {}, + validationErrors: Array as PropType>, + validationStatus: String as PropType, + value: Array as PropType>, + visible: Boolean, + width: [Number, String] + } +}; + +prepareConfigurationComponentConfig(DxFileUploaderOptionsConfig); + +const DxFileUploaderOptions = defineComponent(DxFileUploaderOptionsConfig); + +(DxFileUploaderOptions as any).$_optionName = "fileUploaderOptions"; + const DxFilterBuilderConfig = { emits: { "update:isActive": null, @@ -2666,6 +3154,9 @@ const DxItemConfig = { "update:hoveredElement": null, "update:aiOptions": null, "update:alignItemLabels": null, + "update:alt": null, + "update:attachments": null, + "update:author": null, "update:badge": null, "update:buttonOptions": null, "update:caption": null, @@ -2682,6 +3173,9 @@ const DxItemConfig = { "update:horizontalAlignment": null, "update:html": null, "update:icon": null, + "update:id": null, + "update:isDeleted": null, + "update:isEdited": null, "update:isRequired": null, "update:items": null, "update:itemType": null, @@ -2692,12 +3186,15 @@ const DxItemConfig = { "update:name": null, "update:options": null, "update:showText": null, + "update:src": null, "update:tabPanelOptions": null, "update:tabs": null, "update:tabTemplate": null, "update:template": null, "update:text": null, + "update:timestamp": null, "update:title": null, + "update:type": null, "update:validationRules": null, "update:verticalAlignment": null, "update:visible": null, @@ -2707,6 +3204,9 @@ const DxItemConfig = { props: { aiOptions: Object as PropType>, alignItemLabels: Boolean, + alt: String, + attachments: Array as PropType>, + author: Object as PropType>, badge: String, buttonOptions: Object as PropType>, caption: String, @@ -2723,6 +3223,9 @@ const DxItemConfig = { horizontalAlignment: String as PropType, html: String, icon: String, + id: [Number, String], + isDeleted: Boolean, + isEdited: Boolean, isRequired: Boolean, items: Array as PropType>, itemType: String as PropType, @@ -2733,12 +3236,15 @@ const DxItemConfig = { name: String as PropType, options: {}, showText: String as PropType, + src: String, tabPanelOptions: Object as PropType>, tabs: Array as PropType>>, tabTemplate: {}, template: {}, text: String, + timestamp: [Date, Number, String], title: String, + type: String, validationRules: Array as PropType>, verticalAlignment: String as PropType, visible: Boolean, @@ -2756,6 +3262,8 @@ const DxItem = defineComponent(DxItemConfig); (DxItem as any).$_expectedChildren = { aiOptions: { isCollectionItem: false, optionName: "aiOptions" }, AsyncRule: { isCollectionItem: true, optionName: "validationRules" }, + attachment: { isCollectionItem: true, optionName: "attachments" }, + author: { isCollectionItem: false, optionName: "author" }, buttonOptions: { isCollectionItem: false, optionName: "buttonOptions" }, colCountByScreen: { isCollectionItem: false, optionName: "colCountByScreen" }, CompareRule: { isCollectionItem: true, optionName: "validationRules" }, @@ -2885,6 +3393,33 @@ const DxLookup = defineComponent(DxLookupConfig); (DxLookup as any).$_optionName = "lookup"; +const DxMessageTimestampFormatConfig = { + emits: { + "update:isActive": null, + "update:hoveredElement": null, + "update:currency": null, + "update:formatter": null, + "update:parser": null, + "update:precision": null, + "update:type": null, + "update:useCurrencyAccountingStyle": null, + }, + props: { + currency: String, + formatter: Function as PropType<((value: number | Date) => string)>, + parser: Function as PropType<((value: string) => number | Date)>, + precision: Number, + type: String as PropType, + useCurrencyAccountingStyle: Boolean + } +}; + +prepareConfigurationComponentConfig(DxMessageTimestampFormatConfig); + +const DxMessageTimestampFormat = defineComponent(DxMessageTimestampFormatConfig); + +(DxMessageTimestampFormat as any).$_optionName = "messageTimestampFormat"; + const DxMyConfig = { emits: { "update:isActive": null, @@ -3532,6 +4067,27 @@ const DxSelection = defineComponent(DxSelectionConfig); (DxSelection as any).$_optionName = "selection"; +const DxSendButtonOptionsConfig = { + emits: { + "update:isActive": null, + "update:hoveredElement": null, + "update:action": null, + "update:icon": null, + "update:onClick": null, + }, + props: { + action: String as PropType, + icon: String, + onClick: Function as PropType<((e: SendButtonClickEvent) => void)> + } +}; + +prepareConfigurationComponentConfig(DxSendButtonOptionsConfig); + +const DxSendButtonOptions = defineComponent(DxSendButtonOptionsConfig); + +(DxSendButtonOptions as any).$_optionName = "sendButtonOptions"; + const DxShowConfig = { emits: { "update:isActive": null, @@ -3659,6 +4215,108 @@ const DxSorting = defineComponent(DxSortingConfig); (DxSorting as any).$_optionName = "sorting"; +const DxSpeechRecognitionConfigConfig = { + emits: { + "update:isActive": null, + "update:hoveredElement": null, + "update:continuous": null, + "update:grammars": null, + "update:interimResults": null, + "update:lang": null, + "update:maxAlternatives": null, + }, + props: { + continuous: Boolean, + grammars: Array as PropType>, + interimResults: Boolean, + lang: String, + maxAlternatives: Number + } +}; + +prepareConfigurationComponentConfig(DxSpeechRecognitionConfigConfig); + +const DxSpeechRecognitionConfig = defineComponent(DxSpeechRecognitionConfigConfig); + +(DxSpeechRecognitionConfig as any).$_optionName = "speechRecognitionConfig"; + +const DxSpeechToTextOptionsConfig = { + emits: { + "update:isActive": null, + "update:hoveredElement": null, + "update:accessKey": null, + "update:activeStateEnabled": null, + "update:customSpeechRecognizer": null, + "update:disabled": null, + "update:elementAttr": null, + "update:focusStateEnabled": null, + "update:height": null, + "update:hint": null, + "update:hoverStateEnabled": null, + "update:onContentReady": null, + "update:onDisposing": null, + "update:onEnd": null, + "update:onError": null, + "update:onInitialized": null, + "update:onOptionChanged": null, + "update:onResult": null, + "update:onStartClick": null, + "update:onStopClick": null, + "update:rtlEnabled": null, + "update:speechRecognitionConfig": null, + "update:startIcon": null, + "update:startText": null, + "update:stopIcon": null, + "update:stopText": null, + "update:stylingMode": null, + "update:tabIndex": null, + "update:type": null, + "update:visible": null, + "update:width": null, + }, + props: { + accessKey: String, + activeStateEnabled: Boolean, + customSpeechRecognizer: Object as PropType>, + disabled: Boolean, + elementAttr: Object as PropType>, + focusStateEnabled: Boolean, + height: [Number, String], + hint: String, + hoverStateEnabled: Boolean, + onContentReady: Function as PropType<((e: SpeechToTextContentReadyEvent) => void)>, + onDisposing: Function as PropType<((e: SpeechToTextDisposingEvent) => void)>, + onEnd: Function as PropType<((e: EndEvent) => void)>, + onError: Function as PropType<((e: ErrorEvent) => void)>, + onInitialized: Function as PropType<((e: SpeechToTextInitializedEvent) => void)>, + onOptionChanged: Function as PropType<((e: SpeechToTextOptionChangedEvent) => void)>, + onResult: Function as PropType<((e: ResultEvent) => void)>, + onStartClick: Function as PropType<((e: StartClickEvent) => void)>, + onStopClick: Function as PropType<((e: StopClickEvent) => void)>, + rtlEnabled: Boolean, + speechRecognitionConfig: Object as PropType | SpeechRecognitionConfig>, + startIcon: String, + startText: String, + stopIcon: String, + stopText: String, + stylingMode: String as PropType, + tabIndex: Number, + type: String as PropType, + visible: Boolean, + width: [Number, String] + } +}; + +prepareConfigurationComponentConfig(DxSpeechToTextOptionsConfig); + +const DxSpeechToTextOptions = defineComponent(DxSpeechToTextOptionsConfig); + +(DxSpeechToTextOptions as any).$_optionName = "speechToTextOptions"; +(DxSpeechToTextOptions as any).$_expectedChildren = { + customSpeechRecognizer: { isCollectionItem: false, optionName: "customSpeechRecognizer" }, + speechRecognitionConfig: { isCollectionItem: false, optionName: "speechRecognitionConfig" } +}; + const DxStateStoringConfig = { emits: { "update:isActive": null, @@ -4094,6 +4752,97 @@ const DxToolbarItem = defineComponent(DxToolbarItemConfig); (DxToolbarItem as any).$_optionName = "toolbarItems"; (DxToolbarItem as any).$_isCollectionItem = true; +const DxTreeListEditingConfig = { + emits: { + "update:isActive": null, + "update:hoveredElement": null, + "update:allowAdding": null, + "update:allowDeleting": null, + "update:allowUpdating": null, + "update:changes": null, + "update:confirmDelete": null, + "update:editColumnName": null, + "update:editRowKey": null, + "update:form": null, + "update:mode": null, + "update:popup": null, + "update:refreshMode": null, + "update:selectTextOnEditStart": null, + "update:startEditAction": null, + "update:texts": null, + "update:useIcons": null, + }, + props: { + allowAdding: [Boolean, Function] as PropType boolean))>, + allowDeleting: [Boolean, Function] as PropType boolean))>, + allowUpdating: [Boolean, Function] as PropType boolean))>, + changes: Array as PropType>, + confirmDelete: Boolean, + editColumnName: String, + editRowKey: {}, + form: Object as PropType>, + mode: String as PropType, + popup: Object as PropType | Record>, + refreshMode: String as PropType, + selectTextOnEditStart: Boolean, + startEditAction: String as PropType, + texts: Object as PropType>, + useIcons: Boolean + } +}; + +prepareConfigurationComponentConfig(DxTreeListEditingConfig); + +const DxTreeListEditing = defineComponent(DxTreeListEditingConfig); + +(DxTreeListEditing as any).$_optionName = "editing"; +(DxTreeListEditing as any).$_expectedChildren = { + change: { isCollectionItem: true, optionName: "changes" }, + form: { isCollectionItem: false, optionName: "form" }, + popup: { isCollectionItem: false, optionName: "popup" }, + texts: { isCollectionItem: false, optionName: "texts" }, + treeListEditingTexts: { isCollectionItem: false, optionName: "texts" } +}; + +const DxTreeListEditingTextsConfig = { + emits: { + "update:isActive": null, + "update:hoveredElement": null, + "update:addRow": null, + "update:addRowToNode": null, + "update:cancelAllChanges": null, + "update:cancelRowChanges": null, + "update:confirmDeleteMessage": null, + "update:confirmDeleteTitle": null, + "update:deleteRow": null, + "update:editRow": null, + "update:saveAllChanges": null, + "update:saveRowChanges": null, + "update:undeleteRow": null, + "update:validationCancelChanges": null, + }, + props: { + addRow: String, + addRowToNode: String, + cancelAllChanges: String, + cancelRowChanges: String, + confirmDeleteMessage: String, + confirmDeleteTitle: String, + deleteRow: String, + editRow: String, + saveAllChanges: String, + saveRowChanges: String, + undeleteRow: String, + validationCancelChanges: String + } +}; + +prepareConfigurationComponentConfig(DxTreeListEditingTextsConfig); + +const DxTreeListEditingTexts = defineComponent(DxTreeListEditingTextsConfig); + +(DxTreeListEditingTexts as any).$_optionName = "texts"; + const DxTreeListHeaderFilterConfig = { emits: { "update:isActive": null, @@ -4238,6 +4987,53 @@ const DxTreeListToolbarItem = defineComponent(DxTreeListToolbarItemConfig); (DxTreeListToolbarItem as any).$_optionName = "items"; (DxTreeListToolbarItem as any).$_isCollectionItem = true; +const DxTypingUserConfig = { + emits: { + "update:isActive": null, + "update:hoveredElement": null, + "update:avatarAlt": null, + "update:avatarUrl": null, + "update:id": null, + "update:name": null, + }, + props: { + avatarAlt: String, + avatarUrl: String, + id: [Number, String], + name: String + } +}; + +prepareConfigurationComponentConfig(DxTypingUserConfig); + +const DxTypingUser = defineComponent(DxTypingUserConfig); + +(DxTypingUser as any).$_optionName = "typingUsers"; +(DxTypingUser as any).$_isCollectionItem = true; + +const DxUserConfig = { + emits: { + "update:isActive": null, + "update:hoveredElement": null, + "update:avatarAlt": null, + "update:avatarUrl": null, + "update:id": null, + "update:name": null, + }, + props: { + avatarAlt: String, + avatarUrl: String, + id: [Number, String], + name: String + } +}; + +prepareConfigurationComponentConfig(DxUserConfig); + +const DxUser = defineComponent(DxUserConfig); + +(DxUser as any).$_optionName = "user"; + const DxValidationRuleConfig = { emits: { "update:isActive": null, @@ -4283,15 +5079,22 @@ export default DxTreeList; export { DxTreeList, DxAI, + DxAIAssistant, DxAIOptions, + DxAlert, DxAnimation, DxAsyncRule, DxAt, + DxAttachment, + DxAuthor, DxBoundaryOffset, DxButton, DxButtonItem, DxButtonOptions, DxChange, + DxChat, + DxChatEditing, + DxChatItem, DxColCountByScreen, DxCollision, DxColumn, @@ -4308,14 +5111,16 @@ export { DxCursorOffset, DxCustomOperation, DxCustomRule, + DxCustomSpeechRecognizer, + DxDayHeaderFormat, DxEditing, - DxEditingTexts, DxEditorOptions, DxEditorOptionsButton, DxEmailRule, DxEmptyItem, DxField, DxFieldLookup, + DxFileUploaderOptions, DxFilterBuilder, DxFilterBuilderPopup, DxFilterOperationDescriptions, @@ -4337,6 +5142,7 @@ export { DxLabel, DxLoadPanel, DxLookup, + DxMessageTimestampFormat, DxMy, DxNumericRule, DxOffset, @@ -4355,9 +5161,12 @@ export { DxSearch, DxSearchPanel, DxSelection, + DxSendButtonOptions, DxShow, DxSimpleItem, DxSorting, + DxSpeechRecognitionConfig, + DxSpeechToTextOptions, DxStateStoring, DxStringLengthRule, DxTab, @@ -4368,11 +5177,15 @@ export { DxTo, DxToolbar, DxToolbarItem, + DxTreeListEditing, + DxTreeListEditingTexts, DxTreeListHeaderFilter, DxTreeListHeaderFilterSearch, DxTreeListHeaderFilterTexts, DxTreeListSelection, DxTreeListToolbarItem, + DxTypingUser, + DxUser, DxValidationRule }; import type * as DxTreeListTypes from "devextreme/ui/tree_list_types"; diff --git a/packages/devextreme/js/ui/data_grid.d.ts b/packages/devextreme/js/ui/data_grid.d.ts index b4a675e055ab..45ebe3c527b7 100644 --- a/packages/devextreme/js/ui/data_grid.d.ts +++ b/packages/devextreme/js/ui/data_grid.d.ts @@ -101,6 +101,7 @@ export { } from '../common'; export { + AIAssistant, ApplyFilterMode, ColumnChooser, ColumnChooserMode, diff --git a/packages/devextreme/js/ui/data_grid_types.d.ts b/packages/devextreme/js/ui/data_grid_types.d.ts index f12e87eb9c90..fcf7ed3db4b7 100644 --- a/packages/devextreme/js/ui/data_grid_types.d.ts +++ b/packages/devextreme/js/ui/data_grid_types.d.ts @@ -12,6 +12,7 @@ export { Sortable, SortOrder, ToolbarItemLocation, + AIAssistant, ApplyFilterMode, ColumnChooser, ColumnChooserMode, @@ -62,6 +63,7 @@ export { DataGridPredefinedColumnButton, DataGridPredefinedToolbarItem, GroupData, + AIAssistantRequestCreatingEvent, AdaptiveDetailRowPreparingEvent, CellClickEvent, CellDblClickEvent, @@ -112,7 +114,6 @@ export { RowDraggingReorderEvent, ColumnButtonClickEvent, AIColumnRequestCreatingEvent, - AIAssistantRequestCreatingEvent, ColumnButtonTemplateData, ColumnCellTemplateData, ColumnEditCellTemplateData, diff --git a/packages/devextreme/js/ui/tree_list.d.ts b/packages/devextreme/js/ui/tree_list.d.ts index 1e0a90a79d7b..285edd25180f 100644 --- a/packages/devextreme/js/ui/tree_list.d.ts +++ b/packages/devextreme/js/ui/tree_list.d.ts @@ -115,6 +115,7 @@ export { } from '../common'; export { + AIAssistant, ApplyFilterMode, ColumnChooser, ColumnChooserMode, diff --git a/packages/devextreme/js/ui/tree_list_types.d.ts b/packages/devextreme/js/ui/tree_list_types.d.ts index 5a0ddf670657..1ea95a61a974 100644 --- a/packages/devextreme/js/ui/tree_list_types.d.ts +++ b/packages/devextreme/js/ui/tree_list_types.d.ts @@ -1,6 +1,7 @@ export { DisplayMode, SearchMode, + AIAssistant, ApplyFilterMode, ColumnChooser, ColumnChooserMode, @@ -56,6 +57,7 @@ export { TreeListCommandColumnType, TreeListFilterMode, Scrollable, + AIAssistantRequestCreatingEvent, AdaptiveDetailRowPreparingEvent, CellClickEvent, CellDblClickEvent, @@ -106,7 +108,6 @@ export { RowDraggingReorderEvent, ColumnButtonClickEvent, AIColumnRequestCreatingEvent, - AIAssistantRequestCreatingEvent, ColumnButtonTemplateData, ColumnCellTemplateData, ColumnEditCellTemplateData, diff --git a/packages/devextreme/ts/dx.all.d.ts b/packages/devextreme/ts/dx.all.d.ts index 44b09be25f1b..97f306cb53c3 100644 --- a/packages/devextreme/ts/dx.all.d.ts +++ b/packages/devextreme/ts/dx.all.d.ts @@ -4547,6 +4547,45 @@ declare module DevExpress.common.grids { */ readonly formOptions: any; }; + /** + * [descr:AIAssistant] + */ + export type AIAssistant = { + /** + * [descr:AIAssistant.aiIntegration] + */ + aiIntegration?: DevExpress.aiIntegration.AIIntegration; + /** + * [descr:AIAssistant.chat] + */ + chat?: DevExpress.ui.dxChat.Properties; + /** + * [descr:AIAssistant.enabled] + */ + enabled?: boolean; + /** + * [descr:AIAssistant.popup] + */ + popup?: DevExpress.ui.dxPopup.Properties; + /** + * [descr:AIAssistant.title] + */ + title?: string; + }; + /** + * [descr:AIAssistantRequestCreatingInfo] + * @deprecated Attention! This type is for internal purposes only. If you used it previously, please submit a ticket to our {@link https://supportcenter.devexpress.com/ticket/create Support Center}. We will check if there is an alternative solution. + */ + export type AIAssistantRequestCreatingInfo = { + /** + * [descr:AIAssistantRequestCreatingInfo.context] + */ + context: Record; + /** + * [descr:AIAssistantRequestCreatingInfo.responseSchema] + */ + responseSchema: Record; + }; export type AIColumnMode = 'auto' | 'manual'; /** * [descr:AIColumnRequestCreatingInfo] @@ -5762,6 +5801,10 @@ declare module DevExpress.common.grids { GridBaseOptionsBlank, 'focusStateEnabled' > & { + /** + * [descr:GridBaseOptions.aiAssistant] + */ + aiAssistant?: AIAssistant; /** * [descr:GridBaseOptions.aiIntegration] */ @@ -5894,6 +5937,14 @@ declare module DevExpress.common.grids { * [descr:GridBaseOptions.noDataText] */ noDataText?: string; + /** + * [descr:GridBaseOptions.onAIAssistantRequestCreating] + */ + onAIAssistantRequestCreating?: ( + e: DevExpress.common.core.events.EventInfo & + DevExpress.common.core.events.Cancelable & + AIAssistantRequestCreatingInfo + ) => void; /** * [descr:GridBaseOptions.onAdaptiveDetailRowPreparing] */ @@ -12249,6 +12300,15 @@ declare module DevExpress.ui { TKey = any > = DevExpress.common.core.events.EventInfo> & DevExpress.common.grids.AdaptiveDetailRowPreparingInfo; + /** + * [descr:_ui_data_grid_AIAssistantRequestCreatingEvent] + */ + export type AIAssistantRequestCreatingEvent< + TRowData = any, + TKey = any + > = DevExpress.common.core.events.EventInfo> & + DevExpress.common.core.events.Cancelable & + DevExpress.common.grids.AIAssistantRequestCreatingInfo; /** * [descr:_ui_data_grid_AIColumnRequestCreatingEvent] */ @@ -12901,6 +12961,10 @@ declare module DevExpress.ui { readonly row?: Row; }; export type ExplicitTypes = { + AIAssistantRequestCreatingEvent: AIAssistantRequestCreatingEvent< + TRowData, + TKey + >; AdaptiveDetailRowPreparingEvent: AdaptiveDetailRowPreparingEvent< TRowData, TKey @@ -30673,6 +30737,15 @@ declare module DevExpress.ui { TKey = any > = DevExpress.common.core.events.EventInfo> & DevExpress.common.grids.AdaptiveDetailRowPreparingInfo; + /** + * [descr:_ui_tree_list_AIAssistantRequestCreatingEvent] + */ + export type AIAssistantRequestCreatingEvent< + TRowData = any, + TKey = any + > = DevExpress.common.core.events.EventInfo> & + DevExpress.common.core.events.Cancelable & + DevExpress.common.grids.AIAssistantRequestCreatingInfo; /** * [descr:_ui_tree_list_AIColumnRequestCreatingEvent] */ @@ -31132,6 +31205,10 @@ declare module DevExpress.ui { readonly row?: Row; }; export type ExplicitTypes = { + AIAssistantRequestCreatingEvent: AIAssistantRequestCreatingEvent< + TRowData, + TKey + >; AdaptiveDetailRowPreparingEvent: AdaptiveDetailRowPreparingEvent< TRowData, TKey From c21dda87d1d9cb18bbc2b7274aea3c97e57cd1bd Mon Sep 17 00:00:00 2001 From: "anna.shakhova" Date: Tue, 14 Apr 2026 16:46:45 +0200 Subject: [PATCH 3/3] regenerate after rebase --- .../src/ui/data-grid/index.ts | 6 + .../src/ui/data-grid/nested/ai-assistant.ts | 1 - .../src/ui/data-grid/nested/alert-dxi.ts | 1 - .../src/ui/data-grid/nested/attachment-dxi.ts | 1 - .../src/ui/data-grid/nested/author.ts | 1 - .../src/ui/data-grid/nested/chat-editing.ts | 1 - .../src/ui/data-grid/nested/chat-item-dxi.ts | 1 - .../src/ui/data-grid/nested/chat.ts | 10 +- .../nested/custom-speech-recognizer.ts | 1 - .../nested/data-grid-editing-texts.ts | 1 - .../ui/data-grid/nested/data-grid-editing.ts | 1 - .../ui/data-grid/nested/day-header-format.ts | 1 - .../data-grid/nested/file-uploader-options.ts | 1 - .../src/ui/data-grid/nested/index.ts | 2 + .../src/ui/data-grid/nested/item-dxi.ts | 22 +- .../nested/message-timestamp-format.ts | 1 - .../data-grid/nested/send-button-options.ts | 1 - .../nested/speech-recognition-config.ts | 1 - .../nested/speech-to-text-options.ts | 1 - .../data-grid/nested/suggestions-item-dxi.ts | 154 +++++++++ .../src/ui/data-grid/nested/suggestions.ts | 299 ++++++++++++++++++ .../ui/data-grid/nested/typing-user-dxi.ts | 1 - .../src/ui/data-grid/nested/user.ts | 1 - .../src/ui/tree-list/index.ts | 6 + .../src/ui/tree-list/nested/ai-assistant.ts | 1 - .../src/ui/tree-list/nested/alert-dxi.ts | 1 - .../src/ui/tree-list/nested/attachment-dxi.ts | 1 - .../src/ui/tree-list/nested/author.ts | 1 - .../src/ui/tree-list/nested/chat-editing.ts | 1 - .../src/ui/tree-list/nested/chat-item-dxi.ts | 1 - .../src/ui/tree-list/nested/chat.ts | 10 +- .../nested/custom-speech-recognizer.ts | 1 - .../ui/tree-list/nested/day-header-format.ts | 1 - .../tree-list/nested/file-uploader-options.ts | 1 - .../src/ui/tree-list/nested/index.ts | 2 + .../src/ui/tree-list/nested/item-dxi.ts | 22 +- .../nested/message-timestamp-format.ts | 1 - .../tree-list/nested/send-button-options.ts | 1 - .../nested/speech-recognition-config.ts | 1 - .../nested/speech-to-text-options.ts | 1 - .../tree-list/nested/suggestions-item-dxi.ts | 154 +++++++++ .../src/ui/tree-list/nested/suggestions.ts | 299 ++++++++++++++++++ .../nested/tree-list-editing-texts.ts | 1 - .../ui/tree-list/nested/tree-list-editing.ts | 1 - .../ui/tree-list/nested/typing-user-dxi.ts | 1 - .../src/ui/tree-list/nested/user.ts | 1 - packages/devextreme-react/src/data-grid.ts | 114 ++++++- packages/devextreme-react/src/tree-list.ts | 114 ++++++- packages/devextreme-vue/src/data-grid.ts | 126 +++++++- packages/devextreme-vue/src/tree-list.ts | 126 +++++++- 50 files changed, 1442 insertions(+), 58 deletions(-) create mode 100644 packages/devextreme-angular/src/ui/data-grid/nested/suggestions-item-dxi.ts create mode 100644 packages/devextreme-angular/src/ui/data-grid/nested/suggestions.ts create mode 100644 packages/devextreme-angular/src/ui/tree-list/nested/suggestions-item-dxi.ts create mode 100644 packages/devextreme-angular/src/ui/tree-list/nested/suggestions.ts diff --git a/packages/devextreme-angular/src/ui/data-grid/index.ts b/packages/devextreme-angular/src/ui/data-grid/index.ts index 6821f39c9323..ff8f38f42c1b 100644 --- a/packages/devextreme-angular/src/ui/data-grid/index.ts +++ b/packages/devextreme-angular/src/ui/data-grid/index.ts @@ -223,6 +223,8 @@ import { DxoDataGridSpeechRecognitionConfigModule } from 'devextreme-angular/ui/ import { DxoDataGridSpeechToTextOptionsModule } from 'devextreme-angular/ui/data-grid/nested'; import { DxoDataGridStateStoringModule } from 'devextreme-angular/ui/data-grid/nested'; import { DxiDataGridStringLengthRuleModule } from 'devextreme-angular/ui/data-grid/nested'; +import { DxoDataGridSuggestionsModule } from 'devextreme-angular/ui/data-grid/nested'; +import { DxiDataGridSuggestionsItemModule } from 'devextreme-angular/ui/data-grid/nested'; import { DxoDataGridSummaryModule } from 'devextreme-angular/ui/data-grid/nested'; import { DxoDataGridSummaryTextsModule } from 'devextreme-angular/ui/data-grid/nested'; import { DxiDataGridTabModule } from 'devextreme-angular/ui/data-grid/nested'; @@ -2596,6 +2598,8 @@ export class DxDataGridComponent extends DxComponent DxoDataGridSpeechToTextOptionsModule, DxoDataGridStateStoringModule, DxiDataGridStringLengthRuleModule, + DxoDataGridSuggestionsModule, + DxiDataGridSuggestionsItemModule, DxoDataGridSummaryModule, DxoDataGridSummaryTextsModule, DxiDataGridTabModule, @@ -2786,6 +2790,8 @@ export class DxDataGridComponent extends DxComponent DxoDataGridSpeechToTextOptionsModule, DxoDataGridStateStoringModule, DxiDataGridStringLengthRuleModule, + DxoDataGridSuggestionsModule, + DxiDataGridSuggestionsItemModule, DxoDataGridSummaryModule, DxoDataGridSummaryTextsModule, DxiDataGridTabModule, diff --git a/packages/devextreme-angular/src/ui/data-grid/nested/ai-assistant.ts b/packages/devextreme-angular/src/ui/data-grid/nested/ai-assistant.ts index 305e6823ffe4..2441e4937b13 100644 --- a/packages/devextreme-angular/src/ui/data-grid/nested/ai-assistant.ts +++ b/packages/devextreme-angular/src/ui/data-grid/nested/ai-assistant.ts @@ -27,7 +27,6 @@ import { NestedOption } from 'devextreme-angular/core'; @Component({ selector: 'dxo-data-grid-ai-assistant', - standalone: true, template: '', styles: [''], imports: [ DxIntegrationModule ], diff --git a/packages/devextreme-angular/src/ui/data-grid/nested/alert-dxi.ts b/packages/devextreme-angular/src/ui/data-grid/nested/alert-dxi.ts index 8e4fb0efad25..dccb53616d5e 100644 --- a/packages/devextreme-angular/src/ui/data-grid/nested/alert-dxi.ts +++ b/packages/devextreme-angular/src/ui/data-grid/nested/alert-dxi.ts @@ -23,7 +23,6 @@ import { PROPERTY_TOKEN_alerts } from 'devextreme-angular/core/tokens'; @Component({ selector: 'dxi-data-grid-alert', - standalone: true, template: '', styles: [''], imports: [ DxIntegrationModule ], diff --git a/packages/devextreme-angular/src/ui/data-grid/nested/attachment-dxi.ts b/packages/devextreme-angular/src/ui/data-grid/nested/attachment-dxi.ts index 5734d3878ab6..f8ec5574da24 100644 --- a/packages/devextreme-angular/src/ui/data-grid/nested/attachment-dxi.ts +++ b/packages/devextreme-angular/src/ui/data-grid/nested/attachment-dxi.ts @@ -23,7 +23,6 @@ import { PROPERTY_TOKEN_attachments } from 'devextreme-angular/core/tokens'; @Component({ selector: 'dxi-data-grid-attachment', - standalone: true, template: '', styles: [''], imports: [ DxIntegrationModule ], diff --git a/packages/devextreme-angular/src/ui/data-grid/nested/author.ts b/packages/devextreme-angular/src/ui/data-grid/nested/author.ts index 7b1f2efc3a16..74375dc5c998 100644 --- a/packages/devextreme-angular/src/ui/data-grid/nested/author.ts +++ b/packages/devextreme-angular/src/ui/data-grid/nested/author.ts @@ -24,7 +24,6 @@ import { NestedOption } from 'devextreme-angular/core'; @Component({ selector: 'dxo-data-grid-author', - standalone: true, template: '', styles: [''], imports: [ DxIntegrationModule ], diff --git a/packages/devextreme-angular/src/ui/data-grid/nested/chat-editing.ts b/packages/devextreme-angular/src/ui/data-grid/nested/chat-editing.ts index 43a9ccdd6257..93c62b3a9c45 100644 --- a/packages/devextreme-angular/src/ui/data-grid/nested/chat-editing.ts +++ b/packages/devextreme-angular/src/ui/data-grid/nested/chat-editing.ts @@ -25,7 +25,6 @@ import { NestedOption } from 'devextreme-angular/core'; @Component({ selector: 'dxo-data-grid-chat-editing', - standalone: true, template: '', styles: [''], imports: [ DxIntegrationModule ], diff --git a/packages/devextreme-angular/src/ui/data-grid/nested/chat-item-dxi.ts b/packages/devextreme-angular/src/ui/data-grid/nested/chat-item-dxi.ts index 890f18e4ab4a..4fa3d8e50e4a 100644 --- a/packages/devextreme-angular/src/ui/data-grid/nested/chat-item-dxi.ts +++ b/packages/devextreme-angular/src/ui/data-grid/nested/chat-item-dxi.ts @@ -29,7 +29,6 @@ import { @Component({ selector: 'dxi-data-grid-chat-item', - standalone: true, template: '', styles: [''], imports: [ DxIntegrationModule ], diff --git a/packages/devextreme-angular/src/ui/data-grid/nested/chat.ts b/packages/devextreme-angular/src/ui/data-grid/nested/chat.ts index 994b158484b5..c40bfa6ff07a 100644 --- a/packages/devextreme-angular/src/ui/data-grid/nested/chat.ts +++ b/packages/devextreme-angular/src/ui/data-grid/nested/chat.ts @@ -24,6 +24,7 @@ import type { Store } from 'devextreme/data/store'; import type { Format } from 'devextreme/common/core/localization'; import type { dxFileUploaderOptions } from 'devextreme/ui/file_uploader'; import type { dxSpeechToTextOptions } from 'devextreme/ui/speech_to_text'; +import type { dxButtonGroupOptions } from 'devextreme/ui/button_group'; import { DxIntegrationModule, @@ -40,7 +41,6 @@ import { @Component({ selector: 'dxo-data-grid-chat', - standalone: true, template: '', styles: [''], imports: [ DxIntegrationModule ], @@ -390,6 +390,14 @@ export class DxoDataGridChatComponent extends NestedOption implements OnDestroy, this._setOption('speechToTextOptions', value); } + @Input() + get suggestions(): dxButtonGroupOptions { + return this._getOption('suggestions'); + } + set suggestions(value: dxButtonGroupOptions) { + this._setOption('suggestions', value); + } + @Input() get typingUsers(): Array { return this._getOption('typingUsers'); diff --git a/packages/devextreme-angular/src/ui/data-grid/nested/custom-speech-recognizer.ts b/packages/devextreme-angular/src/ui/data-grid/nested/custom-speech-recognizer.ts index 4e43f0302a15..85b44d24609f 100644 --- a/packages/devextreme-angular/src/ui/data-grid/nested/custom-speech-recognizer.ts +++ b/packages/devextreme-angular/src/ui/data-grid/nested/custom-speech-recognizer.ts @@ -24,7 +24,6 @@ import { NestedOption } from 'devextreme-angular/core'; @Component({ selector: 'dxo-data-grid-custom-speech-recognizer', - standalone: true, template: '', styles: [''], imports: [ DxIntegrationModule ], diff --git a/packages/devextreme-angular/src/ui/data-grid/nested/data-grid-editing-texts.ts b/packages/devextreme-angular/src/ui/data-grid/nested/data-grid-editing-texts.ts index b1b74a0d83a6..a8e037deca6e 100644 --- a/packages/devextreme-angular/src/ui/data-grid/nested/data-grid-editing-texts.ts +++ b/packages/devextreme-angular/src/ui/data-grid/nested/data-grid-editing-texts.ts @@ -24,7 +24,6 @@ import { NestedOption } from 'devextreme-angular/core'; @Component({ selector: 'dxo-data-grid-data-grid-editing-texts', - standalone: true, template: '', styles: [''], imports: [ DxIntegrationModule ], diff --git a/packages/devextreme-angular/src/ui/data-grid/nested/data-grid-editing.ts b/packages/devextreme-angular/src/ui/data-grid/nested/data-grid-editing.ts index 45afe895602f..9734081d24e7 100644 --- a/packages/devextreme-angular/src/ui/data-grid/nested/data-grid-editing.ts +++ b/packages/devextreme-angular/src/ui/data-grid/nested/data-grid-editing.ts @@ -36,7 +36,6 @@ import { @Component({ selector: 'dxo-data-grid-data-grid-editing', - standalone: true, template: '', styles: [''], imports: [ DxIntegrationModule ], diff --git a/packages/devextreme-angular/src/ui/data-grid/nested/day-header-format.ts b/packages/devextreme-angular/src/ui/data-grid/nested/day-header-format.ts index 0643c0df940e..7094115361ee 100644 --- a/packages/devextreme-angular/src/ui/data-grid/nested/day-header-format.ts +++ b/packages/devextreme-angular/src/ui/data-grid/nested/day-header-format.ts @@ -25,7 +25,6 @@ import { NestedOption } from 'devextreme-angular/core'; @Component({ selector: 'dxo-data-grid-day-header-format', - standalone: true, template: '', styles: [''], imports: [ DxIntegrationModule ], diff --git a/packages/devextreme-angular/src/ui/data-grid/nested/file-uploader-options.ts b/packages/devextreme-angular/src/ui/data-grid/nested/file-uploader-options.ts index 7cf03b45598c..bf66e7d745db 100644 --- a/packages/devextreme-angular/src/ui/data-grid/nested/file-uploader-options.ts +++ b/packages/devextreme-angular/src/ui/data-grid/nested/file-uploader-options.ts @@ -29,7 +29,6 @@ import { NestedOption } from 'devextreme-angular/core'; @Component({ selector: 'dxo-data-grid-file-uploader-options', - standalone: true, template: '', styles: [''], imports: [ DxIntegrationModule ], diff --git a/packages/devextreme-angular/src/ui/data-grid/nested/index.ts b/packages/devextreme-angular/src/ui/data-grid/nested/index.ts index 48e9dce68371..b09734d10bfc 100644 --- a/packages/devextreme-angular/src/ui/data-grid/nested/index.ts +++ b/packages/devextreme-angular/src/ui/data-grid/nested/index.ts @@ -104,6 +104,8 @@ export * from './speech-recognition-config'; export * from './speech-to-text-options'; export * from './state-storing'; export * from './string-length-rule-dxi'; +export * from './suggestions-item-dxi'; +export * from './suggestions'; export * from './summary-texts'; export * from './summary'; export * from './tab-dxi'; diff --git a/packages/devextreme-angular/src/ui/data-grid/nested/item-dxi.ts b/packages/devextreme-angular/src/ui/data-grid/nested/item-dxi.ts index 6b09ef5f72e5..be0822b60f84 100644 --- a/packages/devextreme-angular/src/ui/data-grid/nested/item-dxi.ts +++ b/packages/devextreme-angular/src/ui/data-grid/nested/item-dxi.ts @@ -20,7 +20,7 @@ import { DOCUMENT } from '@angular/common'; import type * as CommonTypes from 'devextreme/common'; import type { FormItemComponent, FormItemType, LabelLocation, FormPredefinedButtonItem, dxFormButtonItem, dxFormEmptyItem, dxFormGroupItem, dxFormSimpleItem, dxFormTabbedItem } from 'devextreme/ui/form'; -import type { HorizontalAlignment, VerticalAlignment, ToolbarItemLocation, ToolbarItemComponent } from 'devextreme/common'; +import type { HorizontalAlignment, VerticalAlignment, ToolbarItemLocation, ToolbarItemComponent, ButtonType } from 'devextreme/common'; import type { DataGridPredefinedToolbarItem } from 'devextreme/ui/data_grid'; import type { dxTabPanelOptions } from 'devextreme/ui/tab_panel'; import type { dxButtonOptions } from 'devextreme/ui/button'; @@ -457,13 +457,29 @@ export class DxiDataGridItemComponent extends CollectionNestedOption implements } @Input() - get type(): string | undefined { + get type(): string | undefined | ButtonType { return this._getOption('type'); } - set type(value: string | undefined) { + set type(value: string | undefined | ButtonType) { this._setOption('type', value); } + @Input() + get elementAttr(): Record { + return this._getOption('elementAttr'); + } + set elementAttr(value: Record) { + this._setOption('elementAttr', value); + } + + @Input() + get hint(): string { + return this._getOption('hint'); + } + set hint(value: string) { + this._setOption('hint', value); + } + protected get _optionPath() { return 'items'; diff --git a/packages/devextreme-angular/src/ui/data-grid/nested/message-timestamp-format.ts b/packages/devextreme-angular/src/ui/data-grid/nested/message-timestamp-format.ts index c0d8bb5d3e3c..2dce3b868ec4 100644 --- a/packages/devextreme-angular/src/ui/data-grid/nested/message-timestamp-format.ts +++ b/packages/devextreme-angular/src/ui/data-grid/nested/message-timestamp-format.ts @@ -25,7 +25,6 @@ import { NestedOption } from 'devextreme-angular/core'; @Component({ selector: 'dxo-data-grid-message-timestamp-format', - standalone: true, template: '', styles: [''], imports: [ DxIntegrationModule ], diff --git a/packages/devextreme-angular/src/ui/data-grid/nested/send-button-options.ts b/packages/devextreme-angular/src/ui/data-grid/nested/send-button-options.ts index 4b12ecbc2ca8..e58cc01a1111 100644 --- a/packages/devextreme-angular/src/ui/data-grid/nested/send-button-options.ts +++ b/packages/devextreme-angular/src/ui/data-grid/nested/send-button-options.ts @@ -25,7 +25,6 @@ import { NestedOption } from 'devextreme-angular/core'; @Component({ selector: 'dxo-data-grid-send-button-options', - standalone: true, template: '', styles: [''], imports: [ DxIntegrationModule ], diff --git a/packages/devextreme-angular/src/ui/data-grid/nested/speech-recognition-config.ts b/packages/devextreme-angular/src/ui/data-grid/nested/speech-recognition-config.ts index 4dfdb08c240b..1dcd14c9bd10 100644 --- a/packages/devextreme-angular/src/ui/data-grid/nested/speech-recognition-config.ts +++ b/packages/devextreme-angular/src/ui/data-grid/nested/speech-recognition-config.ts @@ -24,7 +24,6 @@ import { NestedOption } from 'devextreme-angular/core'; @Component({ selector: 'dxo-data-grid-speech-recognition-config', - standalone: true, template: '', styles: [''], imports: [ DxIntegrationModule ], diff --git a/packages/devextreme-angular/src/ui/data-grid/nested/speech-to-text-options.ts b/packages/devextreme-angular/src/ui/data-grid/nested/speech-to-text-options.ts index 399793aeb528..b729172a704f 100644 --- a/packages/devextreme-angular/src/ui/data-grid/nested/speech-to-text-options.ts +++ b/packages/devextreme-angular/src/ui/data-grid/nested/speech-to-text-options.ts @@ -26,7 +26,6 @@ import { NestedOption } from 'devextreme-angular/core'; @Component({ selector: 'dxo-data-grid-speech-to-text-options', - standalone: true, template: '', styles: [''], imports: [ DxIntegrationModule ], diff --git a/packages/devextreme-angular/src/ui/data-grid/nested/suggestions-item-dxi.ts b/packages/devextreme-angular/src/ui/data-grid/nested/suggestions-item-dxi.ts new file mode 100644 index 000000000000..536c6033c1d6 --- /dev/null +++ b/packages/devextreme-angular/src/ui/data-grid/nested/suggestions-item-dxi.ts @@ -0,0 +1,154 @@ +/* tslint:disable:max-line-length */ + + +import { + Component, + NgModule, + Host, + ElementRef, + Renderer2, + Inject, + AfterViewInit, + SkipSelf, + Input +} from '@angular/core'; + +import { DOCUMENT } from '@angular/common'; + + +import type { ButtonType } from 'devextreme/common'; + +import { + DxIntegrationModule, + NestedOptionHost, + extractTemplate, + DxTemplateDirective, + IDxTemplateHost, + DxTemplateHost, +} from 'devextreme-angular/core'; +import { CollectionNestedOption } from 'devextreme-angular/core'; + +import { PROPERTY_TOKEN_items } from 'devextreme-angular/core/tokens'; + +@Component({ + selector: 'dxi-data-grid-suggestions-item', + template: '', + styles: [':host { display: block; }'], + imports: [ DxIntegrationModule ], + providers: [ + NestedOptionHost, + DxTemplateHost, + { + provide: PROPERTY_TOKEN_items, + useExisting: DxiDataGridSuggestionsItemComponent, + } + ] +}) +export class DxiDataGridSuggestionsItemComponent extends CollectionNestedOption implements AfterViewInit, + IDxTemplateHost { + @Input() + get disabled(): boolean { + return this._getOption('disabled'); + } + set disabled(value: boolean) { + this._setOption('disabled', value); + } + + @Input() + get elementAttr(): Record { + return this._getOption('elementAttr'); + } + set elementAttr(value: Record) { + this._setOption('elementAttr', value); + } + + @Input() + get hint(): string { + return this._getOption('hint'); + } + set hint(value: string) { + this._setOption('hint', value); + } + + @Input() + get icon(): string { + return this._getOption('icon'); + } + set icon(value: string) { + this._setOption('icon', value); + } + + @Input() + get template(): any { + return this._getOption('template'); + } + set template(value: any) { + this._setOption('template', value); + } + + @Input() + get text(): string { + return this._getOption('text'); + } + set text(value: string) { + this._setOption('text', value); + } + + @Input() + get type(): ButtonType | string { + return this._getOption('type'); + } + set type(value: ButtonType | string) { + this._setOption('type', value); + } + + @Input() + get visible(): boolean { + return this._getOption('visible'); + } + set visible(value: boolean) { + this._setOption('visible', value); + } + + + protected get _optionPath() { + return 'items'; + } + + + constructor(@SkipSelf() @Host() parentOptionHost: NestedOptionHost, + @Host() optionHost: NestedOptionHost, + private renderer: Renderer2, + @Inject(DOCUMENT) private document: any, + @Host() templateHost: DxTemplateHost, + private element: ElementRef) { + super(); + parentOptionHost.setNestedOption(this); + optionHost.setHost(this, this._fullOptionPath.bind(this)); + templateHost.setHost(this); + } + + setTemplate(template: DxTemplateDirective) { + this.template = template; + } + ngAfterViewInit() { + extractTemplate(this, this.element, this.renderer, this.document); + } + + + + ngOnDestroy() { + this._deleteRemovedOptions(this._fullOptionPath()); + } + +} + +@NgModule({ + imports: [ + DxiDataGridSuggestionsItemComponent + ], + exports: [ + DxiDataGridSuggestionsItemComponent + ], +}) +export class DxiDataGridSuggestionsItemModule { } diff --git a/packages/devextreme-angular/src/ui/data-grid/nested/suggestions.ts b/packages/devextreme-angular/src/ui/data-grid/nested/suggestions.ts new file mode 100644 index 000000000000..2fc047160f11 --- /dev/null +++ b/packages/devextreme-angular/src/ui/data-grid/nested/suggestions.ts @@ -0,0 +1,299 @@ +/* tslint:disable:max-line-length */ + + +import { + Component, + OnInit, + OnDestroy, + NgModule, + Host, + SkipSelf, + Input, + Output, + EventEmitter, + ContentChildren, + QueryList +} from '@angular/core'; + + + + +import type { dxButtonGroupItem, ContentReadyEvent, DisposingEvent, InitializedEvent, ItemClickEvent, OptionChangedEvent, SelectionChangedEvent } from 'devextreme/ui/button_group'; +import type { SingleMultipleOrNone, ButtonStyle } from 'devextreme/common'; + +import { + DxIntegrationModule, + NestedOptionHost, + CollectionNestedOption, +} from 'devextreme-angular/core'; +import { NestedOption } from 'devextreme-angular/core'; + +import { + PROPERTY_TOKEN_items, +} from 'devextreme-angular/core/tokens'; + +@Component({ + selector: 'dxo-data-grid-suggestions', + template: '', + styles: [''], + imports: [ DxIntegrationModule ], + providers: [NestedOptionHost] +}) +export class DxoDataGridSuggestionsComponent extends NestedOption implements OnDestroy, OnInit { + @ContentChildren(PROPERTY_TOKEN_items) + set _itemsContentChildren(value: QueryList) { + this.setChildren('items', value); + } + + @Input() + get accessKey(): string | undefined { + return this._getOption('accessKey'); + } + set accessKey(value: string | undefined) { + this._setOption('accessKey', value); + } + + @Input() + get activeStateEnabled(): boolean { + return this._getOption('activeStateEnabled'); + } + set activeStateEnabled(value: boolean) { + this._setOption('activeStateEnabled', value); + } + + @Input() + get buttonTemplate(): any { + return this._getOption('buttonTemplate'); + } + set buttonTemplate(value: any) { + this._setOption('buttonTemplate', value); + } + + @Input() + get disabled(): boolean { + return this._getOption('disabled'); + } + set disabled(value: boolean) { + this._setOption('disabled', value); + } + + @Input() + get elementAttr(): Record { + return this._getOption('elementAttr'); + } + set elementAttr(value: Record) { + this._setOption('elementAttr', value); + } + + @Input() + get focusStateEnabled(): boolean { + return this._getOption('focusStateEnabled'); + } + set focusStateEnabled(value: boolean) { + this._setOption('focusStateEnabled', value); + } + + @Input() + get height(): number | string | undefined { + return this._getOption('height'); + } + set height(value: number | string | undefined) { + this._setOption('height', value); + } + + @Input() + get hint(): string | undefined { + return this._getOption('hint'); + } + set hint(value: string | undefined) { + this._setOption('hint', value); + } + + @Input() + get hoverStateEnabled(): boolean { + return this._getOption('hoverStateEnabled'); + } + set hoverStateEnabled(value: boolean) { + this._setOption('hoverStateEnabled', value); + } + + @Input() + get items(): Array { + return this._getOption('items'); + } + set items(value: Array) { + this._setOption('items', value); + } + + @Input() + get keyExpr(): Function | string { + return this._getOption('keyExpr'); + } + set keyExpr(value: Function | string) { + this._setOption('keyExpr', value); + } + + @Input() + get onContentReady(): ((e: ContentReadyEvent) => void) { + return this._getOption('onContentReady'); + } + set onContentReady(value: ((e: ContentReadyEvent) => void)) { + this._setOption('onContentReady', value); + } + + @Input() + get onDisposing(): ((e: DisposingEvent) => void) { + return this._getOption('onDisposing'); + } + set onDisposing(value: ((e: DisposingEvent) => void)) { + this._setOption('onDisposing', value); + } + + @Input() + get onInitialized(): ((e: InitializedEvent) => void) { + return this._getOption('onInitialized'); + } + set onInitialized(value: ((e: InitializedEvent) => void)) { + this._setOption('onInitialized', value); + } + + @Input() + get onItemClick(): ((e: ItemClickEvent) => void) { + return this._getOption('onItemClick'); + } + set onItemClick(value: ((e: ItemClickEvent) => void)) { + this._setOption('onItemClick', value); + } + + @Input() + get onOptionChanged(): ((e: OptionChangedEvent) => void) { + return this._getOption('onOptionChanged'); + } + set onOptionChanged(value: ((e: OptionChangedEvent) => void)) { + this._setOption('onOptionChanged', value); + } + + @Input() + get onSelectionChanged(): ((e: SelectionChangedEvent) => void) { + return this._getOption('onSelectionChanged'); + } + set onSelectionChanged(value: ((e: SelectionChangedEvent) => void)) { + this._setOption('onSelectionChanged', value); + } + + @Input() + get rtlEnabled(): boolean { + return this._getOption('rtlEnabled'); + } + set rtlEnabled(value: boolean) { + this._setOption('rtlEnabled', value); + } + + @Input() + get selectedItemKeys(): Array { + return this._getOption('selectedItemKeys'); + } + set selectedItemKeys(value: Array) { + this._setOption('selectedItemKeys', value); + } + + @Input() + get selectedItems(): Array { + return this._getOption('selectedItems'); + } + set selectedItems(value: Array) { + this._setOption('selectedItems', value); + } + + @Input() + get selectionMode(): SingleMultipleOrNone { + return this._getOption('selectionMode'); + } + set selectionMode(value: SingleMultipleOrNone) { + this._setOption('selectionMode', value); + } + + @Input() + get stylingMode(): ButtonStyle { + return this._getOption('stylingMode'); + } + set stylingMode(value: ButtonStyle) { + this._setOption('stylingMode', value); + } + + @Input() + get tabIndex(): number { + return this._getOption('tabIndex'); + } + set tabIndex(value: number) { + this._setOption('tabIndex', value); + } + + @Input() + get visible(): boolean { + return this._getOption('visible'); + } + set visible(value: boolean) { + this._setOption('visible', value); + } + + @Input() + get width(): number | string | undefined { + return this._getOption('width'); + } + set width(value: number | string | undefined) { + this._setOption('width', value); + } + + + /** + + * This member supports the internal infrastructure and is not intended to be used directly from your code. + + */ + @Output() selectedItemKeysChange: EventEmitter>; + + /** + + * This member supports the internal infrastructure and is not intended to be used directly from your code. + + */ + @Output() selectedItemsChange: EventEmitter>; + protected get _optionPath() { + return 'suggestions'; + } + + + constructor(@SkipSelf() @Host() parentOptionHost: NestedOptionHost, + @Host() optionHost: NestedOptionHost) { + super(); + this._createEventEmitters([ + { emit: 'selectedItemKeysChange' }, + { emit: 'selectedItemsChange' } + ]); + + parentOptionHost.setNestedOption(this); + optionHost.setHost(this, this._fullOptionPath.bind(this)); + } + + + ngOnInit() { + this._addRecreatedComponent(); + } + + ngOnDestroy() { + this._addRemovedOption(this._getOptionPath()); + } + + +} + +@NgModule({ + imports: [ + DxoDataGridSuggestionsComponent + ], + exports: [ + DxoDataGridSuggestionsComponent + ], +}) +export class DxoDataGridSuggestionsModule { } diff --git a/packages/devextreme-angular/src/ui/data-grid/nested/typing-user-dxi.ts b/packages/devextreme-angular/src/ui/data-grid/nested/typing-user-dxi.ts index ad9b2b123f89..f7374bbef3da 100644 --- a/packages/devextreme-angular/src/ui/data-grid/nested/typing-user-dxi.ts +++ b/packages/devextreme-angular/src/ui/data-grid/nested/typing-user-dxi.ts @@ -23,7 +23,6 @@ import { PROPERTY_TOKEN_typingUsers } from 'devextreme-angular/core/tokens'; @Component({ selector: 'dxi-data-grid-typing-user', - standalone: true, template: '', styles: [''], imports: [ DxIntegrationModule ], diff --git a/packages/devextreme-angular/src/ui/data-grid/nested/user.ts b/packages/devextreme-angular/src/ui/data-grid/nested/user.ts index cc76c1f1aeea..18b340c1a396 100644 --- a/packages/devextreme-angular/src/ui/data-grid/nested/user.ts +++ b/packages/devextreme-angular/src/ui/data-grid/nested/user.ts @@ -24,7 +24,6 @@ import { NestedOption } from 'devextreme-angular/core'; @Component({ selector: 'dxo-data-grid-user', - standalone: true, template: '', styles: [''], imports: [ DxIntegrationModule ], diff --git a/packages/devextreme-angular/src/ui/tree-list/index.ts b/packages/devextreme-angular/src/ui/tree-list/index.ts index 9bfc65944fa2..1abf71b20dae 100644 --- a/packages/devextreme-angular/src/ui/tree-list/index.ts +++ b/packages/devextreme-angular/src/ui/tree-list/index.ts @@ -198,6 +198,8 @@ import { DxoTreeListSpeechRecognitionConfigModule } from 'devextreme-angular/ui/ import { DxoTreeListSpeechToTextOptionsModule } from 'devextreme-angular/ui/tree-list/nested'; import { DxoTreeListStateStoringModule } from 'devextreme-angular/ui/tree-list/nested'; import { DxiTreeListStringLengthRuleModule } from 'devextreme-angular/ui/tree-list/nested'; +import { DxoTreeListSuggestionsModule } from 'devextreme-angular/ui/tree-list/nested'; +import { DxiTreeListSuggestionsItemModule } from 'devextreme-angular/ui/tree-list/nested'; import { DxiTreeListTabModule } from 'devextreme-angular/ui/tree-list/nested'; import { DxiTreeListTabbedItemModule } from 'devextreme-angular/ui/tree-list/nested'; import { DxoTreeListTabPanelOptionsModule } from 'devextreme-angular/ui/tree-list/nested'; @@ -2526,6 +2528,8 @@ export class DxTreeListComponent extends DxComponent DxoTreeListSpeechToTextOptionsModule, DxoTreeListStateStoringModule, DxiTreeListStringLengthRuleModule, + DxoTreeListSuggestionsModule, + DxiTreeListSuggestionsItemModule, DxiTreeListTabModule, DxiTreeListTabbedItemModule, DxoTreeListTabPanelOptionsModule, @@ -2695,6 +2699,8 @@ export class DxTreeListComponent extends DxComponent DxoTreeListSpeechToTextOptionsModule, DxoTreeListStateStoringModule, DxiTreeListStringLengthRuleModule, + DxoTreeListSuggestionsModule, + DxiTreeListSuggestionsItemModule, DxiTreeListTabModule, DxiTreeListTabbedItemModule, DxoTreeListTabPanelOptionsModule, diff --git a/packages/devextreme-angular/src/ui/tree-list/nested/ai-assistant.ts b/packages/devextreme-angular/src/ui/tree-list/nested/ai-assistant.ts index b6e783e6d661..4ebe14d0b23a 100644 --- a/packages/devextreme-angular/src/ui/tree-list/nested/ai-assistant.ts +++ b/packages/devextreme-angular/src/ui/tree-list/nested/ai-assistant.ts @@ -27,7 +27,6 @@ import { NestedOption } from 'devextreme-angular/core'; @Component({ selector: 'dxo-tree-list-ai-assistant', - standalone: true, template: '', styles: [''], imports: [ DxIntegrationModule ], diff --git a/packages/devextreme-angular/src/ui/tree-list/nested/alert-dxi.ts b/packages/devextreme-angular/src/ui/tree-list/nested/alert-dxi.ts index 54372eafab9d..bd8e2d01e7a1 100644 --- a/packages/devextreme-angular/src/ui/tree-list/nested/alert-dxi.ts +++ b/packages/devextreme-angular/src/ui/tree-list/nested/alert-dxi.ts @@ -23,7 +23,6 @@ import { PROPERTY_TOKEN_alerts } from 'devextreme-angular/core/tokens'; @Component({ selector: 'dxi-tree-list-alert', - standalone: true, template: '', styles: [''], imports: [ DxIntegrationModule ], diff --git a/packages/devextreme-angular/src/ui/tree-list/nested/attachment-dxi.ts b/packages/devextreme-angular/src/ui/tree-list/nested/attachment-dxi.ts index 1e378fc01f98..df0a711274bb 100644 --- a/packages/devextreme-angular/src/ui/tree-list/nested/attachment-dxi.ts +++ b/packages/devextreme-angular/src/ui/tree-list/nested/attachment-dxi.ts @@ -23,7 +23,6 @@ import { PROPERTY_TOKEN_attachments } from 'devextreme-angular/core/tokens'; @Component({ selector: 'dxi-tree-list-attachment', - standalone: true, template: '', styles: [''], imports: [ DxIntegrationModule ], diff --git a/packages/devextreme-angular/src/ui/tree-list/nested/author.ts b/packages/devextreme-angular/src/ui/tree-list/nested/author.ts index 9effe4bf0568..845b6cdb1e13 100644 --- a/packages/devextreme-angular/src/ui/tree-list/nested/author.ts +++ b/packages/devextreme-angular/src/ui/tree-list/nested/author.ts @@ -24,7 +24,6 @@ import { NestedOption } from 'devextreme-angular/core'; @Component({ selector: 'dxo-tree-list-author', - standalone: true, template: '', styles: [''], imports: [ DxIntegrationModule ], diff --git a/packages/devextreme-angular/src/ui/tree-list/nested/chat-editing.ts b/packages/devextreme-angular/src/ui/tree-list/nested/chat-editing.ts index 623b36c3e172..f8f4e0314039 100644 --- a/packages/devextreme-angular/src/ui/tree-list/nested/chat-editing.ts +++ b/packages/devextreme-angular/src/ui/tree-list/nested/chat-editing.ts @@ -25,7 +25,6 @@ import { NestedOption } from 'devextreme-angular/core'; @Component({ selector: 'dxo-tree-list-chat-editing', - standalone: true, template: '', styles: [''], imports: [ DxIntegrationModule ], diff --git a/packages/devextreme-angular/src/ui/tree-list/nested/chat-item-dxi.ts b/packages/devextreme-angular/src/ui/tree-list/nested/chat-item-dxi.ts index 2e1204349eb8..2cfe897e9570 100644 --- a/packages/devextreme-angular/src/ui/tree-list/nested/chat-item-dxi.ts +++ b/packages/devextreme-angular/src/ui/tree-list/nested/chat-item-dxi.ts @@ -29,7 +29,6 @@ import { @Component({ selector: 'dxi-tree-list-chat-item', - standalone: true, template: '', styles: [''], imports: [ DxIntegrationModule ], diff --git a/packages/devextreme-angular/src/ui/tree-list/nested/chat.ts b/packages/devextreme-angular/src/ui/tree-list/nested/chat.ts index c6c4fb7b0c04..9c72aa95377e 100644 --- a/packages/devextreme-angular/src/ui/tree-list/nested/chat.ts +++ b/packages/devextreme-angular/src/ui/tree-list/nested/chat.ts @@ -24,6 +24,7 @@ import type { Store } from 'devextreme/data/store'; import type { Format } from 'devextreme/common/core/localization'; import type { dxFileUploaderOptions } from 'devextreme/ui/file_uploader'; import type { dxSpeechToTextOptions } from 'devextreme/ui/speech_to_text'; +import type { dxButtonGroupOptions } from 'devextreme/ui/button_group'; import { DxIntegrationModule, @@ -40,7 +41,6 @@ import { @Component({ selector: 'dxo-tree-list-chat', - standalone: true, template: '', styles: [''], imports: [ DxIntegrationModule ], @@ -390,6 +390,14 @@ export class DxoTreeListChatComponent extends NestedOption implements OnDestroy, this._setOption('speechToTextOptions', value); } + @Input() + get suggestions(): dxButtonGroupOptions { + return this._getOption('suggestions'); + } + set suggestions(value: dxButtonGroupOptions) { + this._setOption('suggestions', value); + } + @Input() get typingUsers(): Array { return this._getOption('typingUsers'); diff --git a/packages/devextreme-angular/src/ui/tree-list/nested/custom-speech-recognizer.ts b/packages/devextreme-angular/src/ui/tree-list/nested/custom-speech-recognizer.ts index d46a5d8c6876..a4791a4e6617 100644 --- a/packages/devextreme-angular/src/ui/tree-list/nested/custom-speech-recognizer.ts +++ b/packages/devextreme-angular/src/ui/tree-list/nested/custom-speech-recognizer.ts @@ -24,7 +24,6 @@ import { NestedOption } from 'devextreme-angular/core'; @Component({ selector: 'dxo-tree-list-custom-speech-recognizer', - standalone: true, template: '', styles: [''], imports: [ DxIntegrationModule ], diff --git a/packages/devextreme-angular/src/ui/tree-list/nested/day-header-format.ts b/packages/devextreme-angular/src/ui/tree-list/nested/day-header-format.ts index c4809356092d..e259fe6978c1 100644 --- a/packages/devextreme-angular/src/ui/tree-list/nested/day-header-format.ts +++ b/packages/devextreme-angular/src/ui/tree-list/nested/day-header-format.ts @@ -25,7 +25,6 @@ import { NestedOption } from 'devextreme-angular/core'; @Component({ selector: 'dxo-tree-list-day-header-format', - standalone: true, template: '', styles: [''], imports: [ DxIntegrationModule ], diff --git a/packages/devextreme-angular/src/ui/tree-list/nested/file-uploader-options.ts b/packages/devextreme-angular/src/ui/tree-list/nested/file-uploader-options.ts index 8193e4ff8831..46b164b16589 100644 --- a/packages/devextreme-angular/src/ui/tree-list/nested/file-uploader-options.ts +++ b/packages/devextreme-angular/src/ui/tree-list/nested/file-uploader-options.ts @@ -29,7 +29,6 @@ import { NestedOption } from 'devextreme-angular/core'; @Component({ selector: 'dxo-tree-list-file-uploader-options', - standalone: true, template: '', styles: [''], imports: [ DxIntegrationModule ], diff --git a/packages/devextreme-angular/src/ui/tree-list/nested/index.ts b/packages/devextreme-angular/src/ui/tree-list/nested/index.ts index 40be9eb5931d..4b68507b0343 100644 --- a/packages/devextreme-angular/src/ui/tree-list/nested/index.ts +++ b/packages/devextreme-angular/src/ui/tree-list/nested/index.ts @@ -89,6 +89,8 @@ export * from './speech-recognition-config'; export * from './speech-to-text-options'; export * from './state-storing'; export * from './string-length-rule-dxi'; +export * from './suggestions-item-dxi'; +export * from './suggestions'; export * from './tab-dxi'; export * from './tab-panel-options-item-dxi'; export * from './tab-panel-options'; diff --git a/packages/devextreme-angular/src/ui/tree-list/nested/item-dxi.ts b/packages/devextreme-angular/src/ui/tree-list/nested/item-dxi.ts index 067721de68e5..a9ac5e9a7b96 100644 --- a/packages/devextreme-angular/src/ui/tree-list/nested/item-dxi.ts +++ b/packages/devextreme-angular/src/ui/tree-list/nested/item-dxi.ts @@ -20,7 +20,7 @@ import { DOCUMENT } from '@angular/common'; import type * as CommonTypes from 'devextreme/common'; import type { FormItemComponent, FormItemType, LabelLocation, FormPredefinedButtonItem, dxFormButtonItem, dxFormEmptyItem, dxFormGroupItem, dxFormSimpleItem, dxFormTabbedItem } from 'devextreme/ui/form'; -import type { HorizontalAlignment, VerticalAlignment, ToolbarItemLocation, ToolbarItemComponent } from 'devextreme/common'; +import type { HorizontalAlignment, VerticalAlignment, ToolbarItemLocation, ToolbarItemComponent, ButtonType } from 'devextreme/common'; import type { TreeListPredefinedToolbarItem } from 'devextreme/ui/tree_list'; import type { dxTabPanelOptions } from 'devextreme/ui/tab_panel'; import type { dxButtonOptions } from 'devextreme/ui/button'; @@ -457,13 +457,29 @@ export class DxiTreeListItemComponent extends CollectionNestedOption implements } @Input() - get type(): string | undefined { + get type(): string | undefined | ButtonType { return this._getOption('type'); } - set type(value: string | undefined) { + set type(value: string | undefined | ButtonType) { this._setOption('type', value); } + @Input() + get elementAttr(): Record { + return this._getOption('elementAttr'); + } + set elementAttr(value: Record) { + this._setOption('elementAttr', value); + } + + @Input() + get hint(): string { + return this._getOption('hint'); + } + set hint(value: string) { + this._setOption('hint', value); + } + protected get _optionPath() { return 'items'; diff --git a/packages/devextreme-angular/src/ui/tree-list/nested/message-timestamp-format.ts b/packages/devextreme-angular/src/ui/tree-list/nested/message-timestamp-format.ts index 26f5242c989a..7c52df1c2f01 100644 --- a/packages/devextreme-angular/src/ui/tree-list/nested/message-timestamp-format.ts +++ b/packages/devextreme-angular/src/ui/tree-list/nested/message-timestamp-format.ts @@ -25,7 +25,6 @@ import { NestedOption } from 'devextreme-angular/core'; @Component({ selector: 'dxo-tree-list-message-timestamp-format', - standalone: true, template: '', styles: [''], imports: [ DxIntegrationModule ], diff --git a/packages/devextreme-angular/src/ui/tree-list/nested/send-button-options.ts b/packages/devextreme-angular/src/ui/tree-list/nested/send-button-options.ts index eb8b391a54c9..4bf6bd3bc4f4 100644 --- a/packages/devextreme-angular/src/ui/tree-list/nested/send-button-options.ts +++ b/packages/devextreme-angular/src/ui/tree-list/nested/send-button-options.ts @@ -25,7 +25,6 @@ import { NestedOption } from 'devextreme-angular/core'; @Component({ selector: 'dxo-tree-list-send-button-options', - standalone: true, template: '', styles: [''], imports: [ DxIntegrationModule ], diff --git a/packages/devextreme-angular/src/ui/tree-list/nested/speech-recognition-config.ts b/packages/devextreme-angular/src/ui/tree-list/nested/speech-recognition-config.ts index ff7554413e51..71ca76e7927f 100644 --- a/packages/devextreme-angular/src/ui/tree-list/nested/speech-recognition-config.ts +++ b/packages/devextreme-angular/src/ui/tree-list/nested/speech-recognition-config.ts @@ -24,7 +24,6 @@ import { NestedOption } from 'devextreme-angular/core'; @Component({ selector: 'dxo-tree-list-speech-recognition-config', - standalone: true, template: '', styles: [''], imports: [ DxIntegrationModule ], diff --git a/packages/devextreme-angular/src/ui/tree-list/nested/speech-to-text-options.ts b/packages/devextreme-angular/src/ui/tree-list/nested/speech-to-text-options.ts index 1a11d392ad97..92fa18ce6521 100644 --- a/packages/devextreme-angular/src/ui/tree-list/nested/speech-to-text-options.ts +++ b/packages/devextreme-angular/src/ui/tree-list/nested/speech-to-text-options.ts @@ -26,7 +26,6 @@ import { NestedOption } from 'devextreme-angular/core'; @Component({ selector: 'dxo-tree-list-speech-to-text-options', - standalone: true, template: '', styles: [''], imports: [ DxIntegrationModule ], diff --git a/packages/devextreme-angular/src/ui/tree-list/nested/suggestions-item-dxi.ts b/packages/devextreme-angular/src/ui/tree-list/nested/suggestions-item-dxi.ts new file mode 100644 index 000000000000..294e6deed5a4 --- /dev/null +++ b/packages/devextreme-angular/src/ui/tree-list/nested/suggestions-item-dxi.ts @@ -0,0 +1,154 @@ +/* tslint:disable:max-line-length */ + + +import { + Component, + NgModule, + Host, + ElementRef, + Renderer2, + Inject, + AfterViewInit, + SkipSelf, + Input +} from '@angular/core'; + +import { DOCUMENT } from '@angular/common'; + + +import type { ButtonType } from 'devextreme/common'; + +import { + DxIntegrationModule, + NestedOptionHost, + extractTemplate, + DxTemplateDirective, + IDxTemplateHost, + DxTemplateHost, +} from 'devextreme-angular/core'; +import { CollectionNestedOption } from 'devextreme-angular/core'; + +import { PROPERTY_TOKEN_items } from 'devextreme-angular/core/tokens'; + +@Component({ + selector: 'dxi-tree-list-suggestions-item', + template: '', + styles: [':host { display: block; }'], + imports: [ DxIntegrationModule ], + providers: [ + NestedOptionHost, + DxTemplateHost, + { + provide: PROPERTY_TOKEN_items, + useExisting: DxiTreeListSuggestionsItemComponent, + } + ] +}) +export class DxiTreeListSuggestionsItemComponent extends CollectionNestedOption implements AfterViewInit, + IDxTemplateHost { + @Input() + get disabled(): boolean { + return this._getOption('disabled'); + } + set disabled(value: boolean) { + this._setOption('disabled', value); + } + + @Input() + get elementAttr(): Record { + return this._getOption('elementAttr'); + } + set elementAttr(value: Record) { + this._setOption('elementAttr', value); + } + + @Input() + get hint(): string { + return this._getOption('hint'); + } + set hint(value: string) { + this._setOption('hint', value); + } + + @Input() + get icon(): string { + return this._getOption('icon'); + } + set icon(value: string) { + this._setOption('icon', value); + } + + @Input() + get template(): any { + return this._getOption('template'); + } + set template(value: any) { + this._setOption('template', value); + } + + @Input() + get text(): string { + return this._getOption('text'); + } + set text(value: string) { + this._setOption('text', value); + } + + @Input() + get type(): ButtonType | string { + return this._getOption('type'); + } + set type(value: ButtonType | string) { + this._setOption('type', value); + } + + @Input() + get visible(): boolean { + return this._getOption('visible'); + } + set visible(value: boolean) { + this._setOption('visible', value); + } + + + protected get _optionPath() { + return 'items'; + } + + + constructor(@SkipSelf() @Host() parentOptionHost: NestedOptionHost, + @Host() optionHost: NestedOptionHost, + private renderer: Renderer2, + @Inject(DOCUMENT) private document: any, + @Host() templateHost: DxTemplateHost, + private element: ElementRef) { + super(); + parentOptionHost.setNestedOption(this); + optionHost.setHost(this, this._fullOptionPath.bind(this)); + templateHost.setHost(this); + } + + setTemplate(template: DxTemplateDirective) { + this.template = template; + } + ngAfterViewInit() { + extractTemplate(this, this.element, this.renderer, this.document); + } + + + + ngOnDestroy() { + this._deleteRemovedOptions(this._fullOptionPath()); + } + +} + +@NgModule({ + imports: [ + DxiTreeListSuggestionsItemComponent + ], + exports: [ + DxiTreeListSuggestionsItemComponent + ], +}) +export class DxiTreeListSuggestionsItemModule { } diff --git a/packages/devextreme-angular/src/ui/tree-list/nested/suggestions.ts b/packages/devextreme-angular/src/ui/tree-list/nested/suggestions.ts new file mode 100644 index 000000000000..f22e3ec402eb --- /dev/null +++ b/packages/devextreme-angular/src/ui/tree-list/nested/suggestions.ts @@ -0,0 +1,299 @@ +/* tslint:disable:max-line-length */ + + +import { + Component, + OnInit, + OnDestroy, + NgModule, + Host, + SkipSelf, + Input, + Output, + EventEmitter, + ContentChildren, + QueryList +} from '@angular/core'; + + + + +import type { dxButtonGroupItem, ContentReadyEvent, DisposingEvent, InitializedEvent, ItemClickEvent, OptionChangedEvent, SelectionChangedEvent } from 'devextreme/ui/button_group'; +import type { SingleMultipleOrNone, ButtonStyle } from 'devextreme/common'; + +import { + DxIntegrationModule, + NestedOptionHost, + CollectionNestedOption, +} from 'devextreme-angular/core'; +import { NestedOption } from 'devextreme-angular/core'; + +import { + PROPERTY_TOKEN_items, +} from 'devextreme-angular/core/tokens'; + +@Component({ + selector: 'dxo-tree-list-suggestions', + template: '', + styles: [''], + imports: [ DxIntegrationModule ], + providers: [NestedOptionHost] +}) +export class DxoTreeListSuggestionsComponent extends NestedOption implements OnDestroy, OnInit { + @ContentChildren(PROPERTY_TOKEN_items) + set _itemsContentChildren(value: QueryList) { + this.setChildren('items', value); + } + + @Input() + get accessKey(): string | undefined { + return this._getOption('accessKey'); + } + set accessKey(value: string | undefined) { + this._setOption('accessKey', value); + } + + @Input() + get activeStateEnabled(): boolean { + return this._getOption('activeStateEnabled'); + } + set activeStateEnabled(value: boolean) { + this._setOption('activeStateEnabled', value); + } + + @Input() + get buttonTemplate(): any { + return this._getOption('buttonTemplate'); + } + set buttonTemplate(value: any) { + this._setOption('buttonTemplate', value); + } + + @Input() + get disabled(): boolean { + return this._getOption('disabled'); + } + set disabled(value: boolean) { + this._setOption('disabled', value); + } + + @Input() + get elementAttr(): Record { + return this._getOption('elementAttr'); + } + set elementAttr(value: Record) { + this._setOption('elementAttr', value); + } + + @Input() + get focusStateEnabled(): boolean { + return this._getOption('focusStateEnabled'); + } + set focusStateEnabled(value: boolean) { + this._setOption('focusStateEnabled', value); + } + + @Input() + get height(): number | string | undefined { + return this._getOption('height'); + } + set height(value: number | string | undefined) { + this._setOption('height', value); + } + + @Input() + get hint(): string | undefined { + return this._getOption('hint'); + } + set hint(value: string | undefined) { + this._setOption('hint', value); + } + + @Input() + get hoverStateEnabled(): boolean { + return this._getOption('hoverStateEnabled'); + } + set hoverStateEnabled(value: boolean) { + this._setOption('hoverStateEnabled', value); + } + + @Input() + get items(): Array { + return this._getOption('items'); + } + set items(value: Array) { + this._setOption('items', value); + } + + @Input() + get keyExpr(): Function | string { + return this._getOption('keyExpr'); + } + set keyExpr(value: Function | string) { + this._setOption('keyExpr', value); + } + + @Input() + get onContentReady(): ((e: ContentReadyEvent) => void) { + return this._getOption('onContentReady'); + } + set onContentReady(value: ((e: ContentReadyEvent) => void)) { + this._setOption('onContentReady', value); + } + + @Input() + get onDisposing(): ((e: DisposingEvent) => void) { + return this._getOption('onDisposing'); + } + set onDisposing(value: ((e: DisposingEvent) => void)) { + this._setOption('onDisposing', value); + } + + @Input() + get onInitialized(): ((e: InitializedEvent) => void) { + return this._getOption('onInitialized'); + } + set onInitialized(value: ((e: InitializedEvent) => void)) { + this._setOption('onInitialized', value); + } + + @Input() + get onItemClick(): ((e: ItemClickEvent) => void) { + return this._getOption('onItemClick'); + } + set onItemClick(value: ((e: ItemClickEvent) => void)) { + this._setOption('onItemClick', value); + } + + @Input() + get onOptionChanged(): ((e: OptionChangedEvent) => void) { + return this._getOption('onOptionChanged'); + } + set onOptionChanged(value: ((e: OptionChangedEvent) => void)) { + this._setOption('onOptionChanged', value); + } + + @Input() + get onSelectionChanged(): ((e: SelectionChangedEvent) => void) { + return this._getOption('onSelectionChanged'); + } + set onSelectionChanged(value: ((e: SelectionChangedEvent) => void)) { + this._setOption('onSelectionChanged', value); + } + + @Input() + get rtlEnabled(): boolean { + return this._getOption('rtlEnabled'); + } + set rtlEnabled(value: boolean) { + this._setOption('rtlEnabled', value); + } + + @Input() + get selectedItemKeys(): Array { + return this._getOption('selectedItemKeys'); + } + set selectedItemKeys(value: Array) { + this._setOption('selectedItemKeys', value); + } + + @Input() + get selectedItems(): Array { + return this._getOption('selectedItems'); + } + set selectedItems(value: Array) { + this._setOption('selectedItems', value); + } + + @Input() + get selectionMode(): SingleMultipleOrNone { + return this._getOption('selectionMode'); + } + set selectionMode(value: SingleMultipleOrNone) { + this._setOption('selectionMode', value); + } + + @Input() + get stylingMode(): ButtonStyle { + return this._getOption('stylingMode'); + } + set stylingMode(value: ButtonStyle) { + this._setOption('stylingMode', value); + } + + @Input() + get tabIndex(): number { + return this._getOption('tabIndex'); + } + set tabIndex(value: number) { + this._setOption('tabIndex', value); + } + + @Input() + get visible(): boolean { + return this._getOption('visible'); + } + set visible(value: boolean) { + this._setOption('visible', value); + } + + @Input() + get width(): number | string | undefined { + return this._getOption('width'); + } + set width(value: number | string | undefined) { + this._setOption('width', value); + } + + + /** + + * This member supports the internal infrastructure and is not intended to be used directly from your code. + + */ + @Output() selectedItemKeysChange: EventEmitter>; + + /** + + * This member supports the internal infrastructure and is not intended to be used directly from your code. + + */ + @Output() selectedItemsChange: EventEmitter>; + protected get _optionPath() { + return 'suggestions'; + } + + + constructor(@SkipSelf() @Host() parentOptionHost: NestedOptionHost, + @Host() optionHost: NestedOptionHost) { + super(); + this._createEventEmitters([ + { emit: 'selectedItemKeysChange' }, + { emit: 'selectedItemsChange' } + ]); + + parentOptionHost.setNestedOption(this); + optionHost.setHost(this, this._fullOptionPath.bind(this)); + } + + + ngOnInit() { + this._addRecreatedComponent(); + } + + ngOnDestroy() { + this._addRemovedOption(this._getOptionPath()); + } + + +} + +@NgModule({ + imports: [ + DxoTreeListSuggestionsComponent + ], + exports: [ + DxoTreeListSuggestionsComponent + ], +}) +export class DxoTreeListSuggestionsModule { } diff --git a/packages/devextreme-angular/src/ui/tree-list/nested/tree-list-editing-texts.ts b/packages/devextreme-angular/src/ui/tree-list/nested/tree-list-editing-texts.ts index 3f9bdde3a3a9..d950aa1827c3 100644 --- a/packages/devextreme-angular/src/ui/tree-list/nested/tree-list-editing-texts.ts +++ b/packages/devextreme-angular/src/ui/tree-list/nested/tree-list-editing-texts.ts @@ -24,7 +24,6 @@ import { NestedOption } from 'devextreme-angular/core'; @Component({ selector: 'dxo-tree-list-tree-list-editing-texts', - standalone: true, template: '', styles: [''], imports: [ DxIntegrationModule ], diff --git a/packages/devextreme-angular/src/ui/tree-list/nested/tree-list-editing.ts b/packages/devextreme-angular/src/ui/tree-list/nested/tree-list-editing.ts index 27289d38ef9c..e8819840a45e 100644 --- a/packages/devextreme-angular/src/ui/tree-list/nested/tree-list-editing.ts +++ b/packages/devextreme-angular/src/ui/tree-list/nested/tree-list-editing.ts @@ -36,7 +36,6 @@ import { @Component({ selector: 'dxo-tree-list-tree-list-editing', - standalone: true, template: '', styles: [''], imports: [ DxIntegrationModule ], diff --git a/packages/devextreme-angular/src/ui/tree-list/nested/typing-user-dxi.ts b/packages/devextreme-angular/src/ui/tree-list/nested/typing-user-dxi.ts index d303e71597a2..e3d4cac2fb3e 100644 --- a/packages/devextreme-angular/src/ui/tree-list/nested/typing-user-dxi.ts +++ b/packages/devextreme-angular/src/ui/tree-list/nested/typing-user-dxi.ts @@ -23,7 +23,6 @@ import { PROPERTY_TOKEN_typingUsers } from 'devextreme-angular/core/tokens'; @Component({ selector: 'dxi-tree-list-typing-user', - standalone: true, template: '', styles: [''], imports: [ DxIntegrationModule ], diff --git a/packages/devextreme-angular/src/ui/tree-list/nested/user.ts b/packages/devextreme-angular/src/ui/tree-list/nested/user.ts index 6cadadabdb3e..4b7fbf1a621b 100644 --- a/packages/devextreme-angular/src/ui/tree-list/nested/user.ts +++ b/packages/devextreme-angular/src/ui/tree-list/nested/user.ts @@ -24,7 +24,6 @@ import { NestedOption } from 'devextreme-angular/core'; @Component({ selector: 'dxo-tree-list-user', - standalone: true, template: '', styles: [''], imports: [ DxIntegrationModule ], diff --git a/packages/devextreme-react/src/data-grid.ts b/packages/devextreme-react/src/data-grid.ts index b45bb50c4cd6..2d390d2a0479 100644 --- a/packages/devextreme-react/src/data-grid.ts +++ b/packages/devextreme-react/src/data-grid.ts @@ -18,7 +18,8 @@ import type { ContentReadyEvent as FileUploaderContentReadyEvent, DisposingEvent import type { ContentReadyEvent as FilterBuilderContentReadyEvent, DisposingEvent as FilterBuilderDisposingEvent, EditorPreparedEvent as FilterBuilderEditorPreparedEvent, EditorPreparingEvent as FilterBuilderEditorPreparingEvent, InitializedEvent as FilterBuilderInitializedEvent, OptionChangedEvent as FilterBuilderOptionChangedEvent, dxFilterBuilderField, FieldInfo, ValueChangedEvent as FilterBuilderValueChangedEvent, FilterBuilderOperation, dxFilterBuilderCustomOperation, GroupOperation } from "devextreme/ui/filter_builder"; import type { ContentReadyEvent as FormContentReadyEvent, DisposingEvent as FormDisposingEvent, InitializedEvent as FormInitializedEvent, FormItemType, FormPredefinedButtonItem, OptionChangedEvent as FormOptionChangedEvent, dxFormSimpleItem, dxFormOptions, dxFormGroupItem, dxFormTabbedItem, dxFormEmptyItem, dxFormButtonItem, LabelLocation, FormLabelMode, EditorEnterKeyEvent, FieldDataChangedEvent, SmartPastedEvent, SmartPastingEvent, FormItemComponent } from "devextreme/ui/form"; import type { ContentReadyEvent as SpeechToTextContentReadyEvent, DisposingEvent as SpeechToTextDisposingEvent, InitializedEvent as SpeechToTextInitializedEvent, OptionChangedEvent as SpeechToTextOptionChangedEvent, dxSpeechToTextOptions, CustomSpeechRecognizer as SpeechToTextCustomSpeechRecognizer, EndEvent, ErrorEvent, ResultEvent, StartClickEvent, StopClickEvent, SpeechRecognitionConfig as SpeechToTextSpeechRecognitionConfig } from "devextreme/ui/speech_to_text"; -import type { ContentReadyEvent as TabPanelContentReadyEvent, DisposingEvent as TabPanelDisposingEvent, InitializedEvent as TabPanelInitializedEvent, OptionChangedEvent as TabPanelOptionChangedEvent, dxTabPanelOptions, dxTabPanelItem, ItemClickEvent, ItemContextMenuEvent, ItemHoldEvent, ItemRenderedEvent, SelectionChangedEvent, SelectionChangingEvent, TitleClickEvent, TitleHoldEvent, TitleRenderedEvent } from "devextreme/ui/tab_panel"; +import type { ContentReadyEvent as ButtonGroupContentReadyEvent, DisposingEvent as ButtonGroupDisposingEvent, InitializedEvent as ButtonGroupInitializedEvent, OptionChangedEvent as ButtonGroupOptionChangedEvent, dxButtonGroupOptions, dxButtonGroupItem, ItemClickEvent, SelectionChangedEvent } from "devextreme/ui/button_group"; +import type { ContentReadyEvent as TabPanelContentReadyEvent, DisposingEvent as TabPanelDisposingEvent, InitializedEvent as TabPanelInitializedEvent, OptionChangedEvent as TabPanelOptionChangedEvent, dxTabPanelOptions, ItemClickEvent as TabPanelItemClickEvent, SelectionChangedEvent as TabPanelSelectionChangedEvent, dxTabPanelItem, ItemContextMenuEvent, ItemHoldEvent, ItemRenderedEvent, SelectionChangingEvent, TitleClickEvent, TitleHoldEvent, TitleRenderedEvent } from "devextreme/ui/tab_panel"; import type { DisposingEvent as ChatDisposingEvent, InitializedEvent as ChatInitializedEvent, dxChatOptions, OptionChangedEvent as ChatOptionChangedEvent, Alert as ChatAlert, Message, AttachmentDownloadClickEvent, InputFieldTextChangedEvent, MessageDeletedEvent, MessageDeletingEvent, MessageEditCanceledEvent, MessageEditingStartEvent, MessageEnteredEvent, MessageUpdatedEvent, MessageUpdatingEvent, TypingEndEvent, TypingStartEvent, SendButtonProperties, User as ChatUser, Attachment as ChatAttachment, SendButtonAction, SendButtonClickEvent } from "devextreme/ui/chat"; import type { AIIntegration } from "devextreme/common/ai-integration"; import type { dxPopupOptions, dxPopupToolbarItem, ToolbarLocation } from "devextreme/ui/popup"; @@ -136,7 +137,7 @@ const DataGrid = memo( } ), []); - const subscribableOptions = useMemo(() => (["columns","editing","editing.changes","editing.editColumnName","editing.editRowKey","filterValue","focusedColumnIndex","focusedRowIndex","focusedRowKey","groupPanel","groupPanel.visible","paging","paging.pageIndex","paging.pageSize","selectedRowKeys","selectionFilter","aIAssistant.chat.items","chat.editing.changes","chat.editing.editColumnName","chat.editing.editRowKey","filterBuilder.value","filterBuilderPopup.height","filterBuilderPopup.position","filterBuilderPopup.visible","filterBuilderPopup.width","filterPanel.filterEnabled","dataGridEditing.form.formData","dataGridEditing.popup.height","aIAssistant.popup.height","dataGridEditing.popup.position","aIAssistant.popup.position","dataGridEditing.popup.visible","aIAssistant.popup.visible","dataGridEditing.popup.width","aIAssistant.popup.width","searchPanel.text"]), []); + const subscribableOptions = useMemo(() => (["columns","editing","editing.changes","editing.editColumnName","editing.editRowKey","filterValue","focusedColumnIndex","focusedRowIndex","focusedRowKey","groupPanel","groupPanel.visible","paging","paging.pageIndex","paging.pageSize","selectedRowKeys","selectionFilter","aIAssistant.chat.items","chat.editing.changes","chat.editing.editColumnName","chat.editing.editRowKey","filterBuilder.value","filterBuilderPopup.height","filterBuilderPopup.position","filterBuilderPopup.visible","filterBuilderPopup.width","filterPanel.filterEnabled","dataGridEditing.form.formData","dataGridEditing.popup.height","aIAssistant.popup.height","dataGridEditing.popup.position","aIAssistant.popup.position","dataGridEditing.popup.visible","aIAssistant.popup.visible","dataGridEditing.popup.width","aIAssistant.popup.width","searchPanel.text","chat.suggestions.selectedItemKeys","chat.suggestions.selectedItems"]), []); const independentEvents = useMemo(() => (["onAdaptiveDetailRowPreparing","onAIAssistantRequestCreating","onAIColumnRequestCreating","onCellClick","onCellDblClick","onCellPrepared","onContentReady","onContextMenuPreparing","onDataErrorOccurred","onDisposing","onEditCanceled","onEditCanceling","onEditingStart","onEditorPrepared","onEditorPreparing","onExporting","onFocusedCellChanging","onFocusedRowChanging","onInitialized","onInitNewRow","onKeyDown","onRowClick","onRowCollapsed","onRowCollapsing","onRowDblClick","onRowExpanded","onRowExpanding","onRowInserted","onRowInserting","onRowPrepared","onRowRemoved","onRowRemoving","onRowUpdated","onRowUpdating","onRowValidating","onSaved","onSaving","onToolbarPreparing"]), []); const defaults = useMemo(() => ({ @@ -633,6 +634,7 @@ type IChatProps = React.PropsWithChildren<{ showUserName?: boolean; speechToTextEnabled?: boolean; speechToTextOptions?: dxSpeechToTextOptions; + suggestions?: dxButtonGroupOptions; typingUsers?: Array; user?: ChatUser; visible?: boolean; @@ -663,6 +665,7 @@ const _componentChat = (props: IChatProps) => { messageTimestampFormat: { optionName: "messageTimestampFormat", isCollectionItem: false }, sendButtonOptions: { optionName: "sendButtonOptions", isCollectionItem: false }, speechToTextOptions: { optionName: "speechToTextOptions", isCollectionItem: false }, + suggestions: { optionName: "suggestions", isCollectionItem: false }, typingUser: { optionName: "typingUsers", isCollectionItem: true }, user: { optionName: "user", isCollectionItem: false } }, @@ -2771,6 +2774,7 @@ const IndicatorOptions = Object.assign; + hint?: string; tabRender?: (...params: any) => React.ReactNode; tabComponent?: React.ComponentType; render?: (...params: any) => React.ReactNode; @@ -3959,6 +3965,100 @@ const StringLengthRule = Object.assign string | any) | template; + disabled?: boolean; + elementAttr?: Record; + focusStateEnabled?: boolean; + height?: number | string | undefined; + hint?: string | undefined; + hoverStateEnabled?: boolean; + items?: Array; + keyExpr?: (() => void) | string; + onContentReady?: ((e: ButtonGroupContentReadyEvent) => void); + onDisposing?: ((e: ButtonGroupDisposingEvent) => void); + onInitialized?: ((e: ButtonGroupInitializedEvent) => void); + onItemClick?: ((e: ItemClickEvent) => void); + onOptionChanged?: ((e: ButtonGroupOptionChangedEvent) => void); + onSelectionChanged?: ((e: SelectionChangedEvent) => void); + rtlEnabled?: boolean; + selectedItemKeys?: Array; + selectedItems?: Array; + selectionMode?: SingleMultipleOrNone; + stylingMode?: ButtonStyle; + tabIndex?: number; + visible?: boolean; + width?: number | string | undefined; + defaultSelectedItemKeys?: Array; + onSelectedItemKeysChange?: (value: Array) => void; + defaultSelectedItems?: Array; + onSelectedItemsChange?: (value: Array) => void; + buttonRender?: (...params: any) => React.ReactNode; + buttonComponent?: React.ComponentType; +}> +const _componentSuggestions = (props: ISuggestionsProps) => { + return React.createElement(NestedOption, { + ...props, + elementDescriptor: { + OptionName: "suggestions", + DefaultsProps: { + defaultSelectedItemKeys: "selectedItemKeys", + defaultSelectedItems: "selectedItems" + }, + ExpectedChildren: { + item: { optionName: "items", isCollectionItem: true }, + suggestionsItem: { optionName: "items", isCollectionItem: true } + }, + TemplateProps: [{ + tmplOption: "buttonTemplate", + render: "buttonRender", + component: "buttonComponent" + }], + }, + }); +}; + +const Suggestions = Object.assign(_componentSuggestions, { + componentType: "option", +}); + +// owners: +// Suggestions +type ISuggestionsItemProps = React.PropsWithChildren<{ + disabled?: boolean; + elementAttr?: Record; + hint?: string; + icon?: string; + template?: ((itemData: CollectionWidgetItem, itemIndex: number, itemElement: any) => string | any) | template; + text?: string; + type?: ButtonType | string; + visible?: boolean; + render?: (...params: any) => React.ReactNode; + component?: React.ComponentType; +}> +const _componentSuggestionsItem = (props: ISuggestionsItemProps) => { + return React.createElement(NestedOption, { + ...props, + elementDescriptor: { + OptionName: "items", + IsCollectionItem: true, + TemplateProps: [{ + tmplOption: "template", + render: "render", + component: "component" + }], + }, + }); +}; + +const SuggestionsItem = Object.assign(_componentSuggestionsItem, { + componentType: "option", +}); + // owners: // DataGrid type ISummaryProps = React.PropsWithChildren<{ @@ -4169,12 +4269,12 @@ type ITabPanelOptionsProps = React.PropsWithChildren<{ onContentReady?: ((e: TabPanelContentReadyEvent) => void); onDisposing?: ((e: TabPanelDisposingEvent) => void); onInitialized?: ((e: TabPanelInitializedEvent) => void); - onItemClick?: ((e: ItemClickEvent) => void); + onItemClick?: ((e: TabPanelItemClickEvent) => void); onItemContextMenu?: ((e: ItemContextMenuEvent) => void); onItemHold?: ((e: ItemHoldEvent) => void); onItemRendered?: ((e: ItemRenderedEvent) => void); onOptionChanged?: ((e: TabPanelOptionChangedEvent) => void); - onSelectionChanged?: ((e: SelectionChangedEvent) => void); + onSelectionChanged?: ((e: TabPanelSelectionChangedEvent) => void); onSelectionChanging?: ((e: SelectionChangingEvent) => void); onTitleClick?: ((e: TitleClickEvent) => void); onTitleHold?: ((e: TitleHoldEvent) => void); @@ -4780,6 +4880,10 @@ export { IStateStoringProps, StringLengthRule, IStringLengthRuleProps, + Suggestions, + ISuggestionsProps, + SuggestionsItem, + ISuggestionsItemProps, Summary, ISummaryProps, SummaryTexts, diff --git a/packages/devextreme-react/src/tree-list.ts b/packages/devextreme-react/src/tree-list.ts index 18635b1fee32..45af63556bfa 100644 --- a/packages/devextreme-react/src/tree-list.ts +++ b/packages/devextreme-react/src/tree-list.ts @@ -17,7 +17,8 @@ import type { ContentReadyEvent as FileUploaderContentReadyEvent, DisposingEvent import type { ContentReadyEvent as FilterBuilderContentReadyEvent, DisposingEvent as FilterBuilderDisposingEvent, EditorPreparedEvent as FilterBuilderEditorPreparedEvent, EditorPreparingEvent as FilterBuilderEditorPreparingEvent, InitializedEvent as FilterBuilderInitializedEvent, OptionChangedEvent as FilterBuilderOptionChangedEvent, dxFilterBuilderField, FieldInfo, ValueChangedEvent as FilterBuilderValueChangedEvent, FilterBuilderOperation, dxFilterBuilderCustomOperation, GroupOperation } from "devextreme/ui/filter_builder"; import type { ContentReadyEvent as FormContentReadyEvent, DisposingEvent as FormDisposingEvent, InitializedEvent as FormInitializedEvent, FormItemType, FormPredefinedButtonItem, OptionChangedEvent as FormOptionChangedEvent, dxFormSimpleItem, dxFormOptions, dxFormGroupItem, dxFormTabbedItem, dxFormEmptyItem, dxFormButtonItem, LabelLocation, FormLabelMode, EditorEnterKeyEvent, FieldDataChangedEvent, SmartPastedEvent, SmartPastingEvent, FormItemComponent } from "devextreme/ui/form"; import type { ContentReadyEvent as SpeechToTextContentReadyEvent, DisposingEvent as SpeechToTextDisposingEvent, InitializedEvent as SpeechToTextInitializedEvent, OptionChangedEvent as SpeechToTextOptionChangedEvent, dxSpeechToTextOptions, CustomSpeechRecognizer as SpeechToTextCustomSpeechRecognizer, EndEvent, ErrorEvent, ResultEvent, StartClickEvent, StopClickEvent, SpeechRecognitionConfig as SpeechToTextSpeechRecognitionConfig } from "devextreme/ui/speech_to_text"; -import type { ContentReadyEvent as TabPanelContentReadyEvent, DisposingEvent as TabPanelDisposingEvent, InitializedEvent as TabPanelInitializedEvent, OptionChangedEvent as TabPanelOptionChangedEvent, dxTabPanelOptions, dxTabPanelItem, ItemClickEvent, ItemContextMenuEvent, ItemHoldEvent, ItemRenderedEvent, SelectionChangedEvent, SelectionChangingEvent, TitleClickEvent, TitleHoldEvent, TitleRenderedEvent } from "devextreme/ui/tab_panel"; +import type { ContentReadyEvent as ButtonGroupContentReadyEvent, DisposingEvent as ButtonGroupDisposingEvent, InitializedEvent as ButtonGroupInitializedEvent, OptionChangedEvent as ButtonGroupOptionChangedEvent, dxButtonGroupOptions, dxButtonGroupItem, ItemClickEvent, SelectionChangedEvent } from "devextreme/ui/button_group"; +import type { ContentReadyEvent as TabPanelContentReadyEvent, DisposingEvent as TabPanelDisposingEvent, InitializedEvent as TabPanelInitializedEvent, OptionChangedEvent as TabPanelOptionChangedEvent, dxTabPanelOptions, ItemClickEvent as TabPanelItemClickEvent, SelectionChangedEvent as TabPanelSelectionChangedEvent, dxTabPanelItem, ItemContextMenuEvent, ItemHoldEvent, ItemRenderedEvent, SelectionChangingEvent, TitleClickEvent, TitleHoldEvent, TitleRenderedEvent } from "devextreme/ui/tab_panel"; import type { DisposingEvent as ChatDisposingEvent, InitializedEvent as ChatInitializedEvent, dxChatOptions, OptionChangedEvent as ChatOptionChangedEvent, Alert as ChatAlert, Message, AttachmentDownloadClickEvent, InputFieldTextChangedEvent, MessageDeletedEvent, MessageDeletingEvent, MessageEditCanceledEvent, MessageEditingStartEvent, MessageEnteredEvent, MessageUpdatedEvent, MessageUpdatingEvent, TypingEndEvent, TypingStartEvent, SendButtonProperties, User as ChatUser, Attachment as ChatAttachment, SendButtonAction, SendButtonClickEvent } from "devextreme/ui/chat"; import type { AIIntegration } from "devextreme/common/ai-integration"; import type { dxPopupOptions, dxPopupToolbarItem, ToolbarLocation } from "devextreme/ui/popup"; @@ -130,7 +131,7 @@ const TreeList = memo( } ), []); - const subscribableOptions = useMemo(() => (["columns","editing","editing.changes","editing.editColumnName","editing.editRowKey","expandedRowKeys","filterValue","focusedColumnIndex","focusedRowIndex","focusedRowKey","paging","paging.pageIndex","paging.pageSize","selectedRowKeys","aIAssistant.chat.items","chat.editing.changes","chat.editing.editColumnName","chat.editing.editRowKey","filterBuilder.value","filterBuilderPopup.height","filterBuilderPopup.position","filterBuilderPopup.visible","filterBuilderPopup.width","filterPanel.filterEnabled","treeListEditing.form.formData","treeListEditing.popup.height","aIAssistant.popup.height","treeListEditing.popup.position","aIAssistant.popup.position","treeListEditing.popup.visible","aIAssistant.popup.visible","treeListEditing.popup.width","aIAssistant.popup.width","searchPanel.text"]), []); + const subscribableOptions = useMemo(() => (["columns","editing","editing.changes","editing.editColumnName","editing.editRowKey","expandedRowKeys","filterValue","focusedColumnIndex","focusedRowIndex","focusedRowKey","paging","paging.pageIndex","paging.pageSize","selectedRowKeys","aIAssistant.chat.items","chat.editing.changes","chat.editing.editColumnName","chat.editing.editRowKey","filterBuilder.value","filterBuilderPopup.height","filterBuilderPopup.position","filterBuilderPopup.visible","filterBuilderPopup.width","filterPanel.filterEnabled","treeListEditing.form.formData","treeListEditing.popup.height","aIAssistant.popup.height","treeListEditing.popup.position","aIAssistant.popup.position","treeListEditing.popup.visible","aIAssistant.popup.visible","treeListEditing.popup.width","aIAssistant.popup.width","searchPanel.text","chat.suggestions.selectedItemKeys","chat.suggestions.selectedItems"]), []); const independentEvents = useMemo(() => (["onAdaptiveDetailRowPreparing","onAIAssistantRequestCreating","onAIColumnRequestCreating","onCellClick","onCellDblClick","onCellPrepared","onContentReady","onContextMenuPreparing","onDataErrorOccurred","onDisposing","onEditCanceled","onEditCanceling","onEditingStart","onEditorPrepared","onEditorPreparing","onFocusedCellChanging","onFocusedRowChanging","onInitialized","onInitNewRow","onKeyDown","onNodesInitialized","onRowClick","onRowCollapsed","onRowCollapsing","onRowDblClick","onRowExpanded","onRowExpanding","onRowInserted","onRowInserting","onRowPrepared","onRowRemoved","onRowRemoving","onRowUpdated","onRowUpdating","onRowValidating","onSaved","onSaving","onToolbarPreparing"]), []); const defaults = useMemo(() => ({ @@ -605,6 +606,7 @@ type IChatProps = React.PropsWithChildren<{ showUserName?: boolean; speechToTextEnabled?: boolean; speechToTextOptions?: dxSpeechToTextOptions; + suggestions?: dxButtonGroupOptions; typingUsers?: Array; user?: ChatUser; visible?: boolean; @@ -635,6 +637,7 @@ const _componentChat = (props: IChatProps) => { messageTimestampFormat: { optionName: "messageTimestampFormat", isCollectionItem: false }, sendButtonOptions: { optionName: "sendButtonOptions", isCollectionItem: false }, speechToTextOptions: { optionName: "speechToTextOptions", isCollectionItem: false }, + suggestions: { optionName: "suggestions", isCollectionItem: false }, typingUser: { optionName: "typingUsers", isCollectionItem: true }, user: { optionName: "user", isCollectionItem: false } }, @@ -2338,6 +2341,7 @@ const IndicatorOptions = Object.assign; + hint?: string; tabRender?: (...params: any) => React.ReactNode; tabComponent?: React.ComponentType; render?: (...params: any) => React.ReactNode; @@ -3471,6 +3477,100 @@ const StringLengthRule = Object.assign string | any) | template; + disabled?: boolean; + elementAttr?: Record; + focusStateEnabled?: boolean; + height?: number | string | undefined; + hint?: string | undefined; + hoverStateEnabled?: boolean; + items?: Array; + keyExpr?: (() => void) | string; + onContentReady?: ((e: ButtonGroupContentReadyEvent) => void); + onDisposing?: ((e: ButtonGroupDisposingEvent) => void); + onInitialized?: ((e: ButtonGroupInitializedEvent) => void); + onItemClick?: ((e: ItemClickEvent) => void); + onOptionChanged?: ((e: ButtonGroupOptionChangedEvent) => void); + onSelectionChanged?: ((e: SelectionChangedEvent) => void); + rtlEnabled?: boolean; + selectedItemKeys?: Array; + selectedItems?: Array; + selectionMode?: SingleMultipleOrNone; + stylingMode?: ButtonStyle; + tabIndex?: number; + visible?: boolean; + width?: number | string | undefined; + defaultSelectedItemKeys?: Array; + onSelectedItemKeysChange?: (value: Array) => void; + defaultSelectedItems?: Array; + onSelectedItemsChange?: (value: Array) => void; + buttonRender?: (...params: any) => React.ReactNode; + buttonComponent?: React.ComponentType; +}> +const _componentSuggestions = (props: ISuggestionsProps) => { + return React.createElement(NestedOption, { + ...props, + elementDescriptor: { + OptionName: "suggestions", + DefaultsProps: { + defaultSelectedItemKeys: "selectedItemKeys", + defaultSelectedItems: "selectedItems" + }, + ExpectedChildren: { + item: { optionName: "items", isCollectionItem: true }, + suggestionsItem: { optionName: "items", isCollectionItem: true } + }, + TemplateProps: [{ + tmplOption: "buttonTemplate", + render: "buttonRender", + component: "buttonComponent" + }], + }, + }); +}; + +const Suggestions = Object.assign(_componentSuggestions, { + componentType: "option", +}); + +// owners: +// Suggestions +type ISuggestionsItemProps = React.PropsWithChildren<{ + disabled?: boolean; + elementAttr?: Record; + hint?: string; + icon?: string; + template?: ((itemData: CollectionWidgetItem, itemIndex: number, itemElement: any) => string | any) | template; + text?: string; + type?: ButtonType | string; + visible?: boolean; + render?: (...params: any) => React.ReactNode; + component?: React.ComponentType; +}> +const _componentSuggestionsItem = (props: ISuggestionsItemProps) => { + return React.createElement(NestedOption, { + ...props, + elementDescriptor: { + OptionName: "items", + IsCollectionItem: true, + TemplateProps: [{ + tmplOption: "template", + render: "render", + component: "component" + }], + }, + }); +}; + +const SuggestionsItem = Object.assign(_componentSuggestionsItem, { + componentType: "option", +}); + // owners: // TabbedItem type ITabProps = React.PropsWithChildren<{ @@ -3594,12 +3694,12 @@ type ITabPanelOptionsProps = React.PropsWithChildren<{ onContentReady?: ((e: TabPanelContentReadyEvent) => void); onDisposing?: ((e: TabPanelDisposingEvent) => void); onInitialized?: ((e: TabPanelInitializedEvent) => void); - onItemClick?: ((e: ItemClickEvent) => void); + onItemClick?: ((e: TabPanelItemClickEvent) => void); onItemContextMenu?: ((e: ItemContextMenuEvent) => void); onItemHold?: ((e: ItemHoldEvent) => void); onItemRendered?: ((e: ItemRenderedEvent) => void); onOptionChanged?: ((e: TabPanelOptionChangedEvent) => void); - onSelectionChanged?: ((e: SelectionChangedEvent) => void); + onSelectionChanged?: ((e: TabPanelSelectionChangedEvent) => void); onSelectionChanging?: ((e: SelectionChangingEvent) => void); onTitleClick?: ((e: TitleClickEvent) => void); onTitleHold?: ((e: TitleHoldEvent) => void); @@ -4329,6 +4429,10 @@ export { IStateStoringProps, StringLengthRule, IStringLengthRuleProps, + Suggestions, + ISuggestionsProps, + SuggestionsItem, + ISuggestionsItemProps, Tab, ITabProps, TabbedItem, diff --git a/packages/devextreme-vue/src/data-grid.ts b/packages/devextreme-vue/src/data-grid.ts index 3769f56a45ba..62b699fb25dd 100644 --- a/packages/devextreme-vue/src/data-grid.ts +++ b/packages/devextreme-vue/src/data-grid.ts @@ -292,6 +292,16 @@ import { StopClickEvent, SpeechRecognitionConfig, } from "devextreme/ui/speech_to_text"; +import { + dxButtonGroupOptions, + dxButtonGroupItem, + ContentReadyEvent as ButtonGroupContentReadyEvent, + DisposingEvent as ButtonGroupDisposingEvent, + InitializedEvent as ButtonGroupInitializedEvent, + ItemClickEvent, + OptionChangedEvent as ButtonGroupOptionChangedEvent, + SelectionChangedEvent as ButtonGroupSelectionChangedEvent, +} from "devextreme/ui/button_group"; import { LocateInMenuMode, ShowTextMode, @@ -314,7 +324,7 @@ import { ContentReadyEvent as TabPanelContentReadyEvent, DisposingEvent as TabPanelDisposingEvent, InitializedEvent as TabPanelInitializedEvent, - ItemClickEvent, + ItemClickEvent as TabPanelItemClickEvent, ItemContextMenuEvent, ItemHoldEvent, ItemRenderedEvent, @@ -1202,6 +1212,7 @@ const DxChatConfig = { "update:showUserName": null, "update:speechToTextEnabled": null, "update:speechToTextOptions": null, + "update:suggestions": null, "update:typingUsers": null, "update:user": null, "update:visible": null, @@ -1249,6 +1260,7 @@ const DxChatConfig = { showUserName: Boolean, speechToTextEnabled: Boolean, speechToTextOptions: Object as PropType>, + suggestions: Object as PropType>, typingUsers: Array as PropType>, user: Object as PropType>, visible: Boolean, @@ -1272,6 +1284,7 @@ const DxChat = defineComponent(DxChatConfig); messageTimestampFormat: { isCollectionItem: false, optionName: "messageTimestampFormat" }, sendButtonOptions: { isCollectionItem: false, optionName: "sendButtonOptions" }, speechToTextOptions: { isCollectionItem: false, optionName: "speechToTextOptions" }, + suggestions: { isCollectionItem: false, optionName: "suggestions" }, typingUser: { isCollectionItem: true, optionName: "typingUsers" }, user: { isCollectionItem: false, optionName: "user" } }; @@ -3599,7 +3612,9 @@ const DxItemConfig = { "update:disabled": null, "update:editorOptions": null, "update:editorType": null, + "update:elementAttr": null, "update:helpText": null, + "update:hint": null, "update:horizontalAlignment": null, "update:html": null, "update:icon": null, @@ -3649,7 +3664,9 @@ const DxItemConfig = { disabled: Boolean, editorOptions: {}, editorType: String as PropType, + elementAttr: Object as PropType>, helpText: String, + hint: String, horizontalAlignment: String as PropType, html: String, icon: String, @@ -3674,7 +3691,7 @@ const DxItemConfig = { text: String, timestamp: [Date, Number, String], title: String, - type: String, + type: String as PropType, validationRules: Array as PropType>, verticalAlignment: String as PropType, visible: Boolean, @@ -4862,6 +4879,107 @@ const DxStringLengthRule = defineComponent(DxStringLengthRuleConfig); type: "stringLength" }; +const DxSuggestionsConfig = { + emits: { + "update:isActive": null, + "update:hoveredElement": null, + "update:accessKey": null, + "update:activeStateEnabled": null, + "update:buttonTemplate": null, + "update:disabled": null, + "update:elementAttr": null, + "update:focusStateEnabled": null, + "update:height": null, + "update:hint": null, + "update:hoverStateEnabled": null, + "update:items": null, + "update:keyExpr": null, + "update:onContentReady": null, + "update:onDisposing": null, + "update:onInitialized": null, + "update:onItemClick": null, + "update:onOptionChanged": null, + "update:onSelectionChanged": null, + "update:rtlEnabled": null, + "update:selectedItemKeys": null, + "update:selectedItems": null, + "update:selectionMode": null, + "update:stylingMode": null, + "update:tabIndex": null, + "update:visible": null, + "update:width": null, + }, + props: { + accessKey: String, + activeStateEnabled: Boolean, + buttonTemplate: {}, + disabled: Boolean, + elementAttr: Object as PropType>, + focusStateEnabled: Boolean, + height: [Number, String], + hint: String, + hoverStateEnabled: Boolean, + items: Array as PropType>, + keyExpr: [Function, String] as PropType<((() => void)) | string>, + onContentReady: Function as PropType<((e: ButtonGroupContentReadyEvent) => void)>, + onDisposing: Function as PropType<((e: ButtonGroupDisposingEvent) => void)>, + onInitialized: Function as PropType<((e: ButtonGroupInitializedEvent) => void)>, + onItemClick: Function as PropType<((e: ItemClickEvent) => void)>, + onOptionChanged: Function as PropType<((e: ButtonGroupOptionChangedEvent) => void)>, + onSelectionChanged: Function as PropType<((e: ButtonGroupSelectionChangedEvent) => void)>, + rtlEnabled: Boolean, + selectedItemKeys: Array as PropType>, + selectedItems: Array as PropType>, + selectionMode: String as PropType, + stylingMode: String as PropType, + tabIndex: Number, + visible: Boolean, + width: [Number, String] + } +}; + +prepareConfigurationComponentConfig(DxSuggestionsConfig); + +const DxSuggestions = defineComponent(DxSuggestionsConfig); + +(DxSuggestions as any).$_optionName = "suggestions"; +(DxSuggestions as any).$_expectedChildren = { + item: { isCollectionItem: true, optionName: "items" }, + suggestionsItem: { isCollectionItem: true, optionName: "items" } +}; + +const DxSuggestionsItemConfig = { + emits: { + "update:isActive": null, + "update:hoveredElement": null, + "update:disabled": null, + "update:elementAttr": null, + "update:hint": null, + "update:icon": null, + "update:template": null, + "update:text": null, + "update:type": null, + "update:visible": null, + }, + props: { + disabled: Boolean, + elementAttr: Object as PropType>, + hint: String, + icon: String, + template: {}, + text: String, + type: String as PropType, + visible: Boolean + } +}; + +prepareConfigurationComponentConfig(DxSuggestionsItemConfig); + +const DxSuggestionsItem = defineComponent(DxSuggestionsItemConfig); + +(DxSuggestionsItem as any).$_optionName = "items"; +(DxSuggestionsItem as any).$_isCollectionItem = true; + const DxSummaryConfig = { emits: { "update:isActive": null, @@ -5079,7 +5197,7 @@ const DxTabPanelOptionsConfig = { onContentReady: Function as PropType<((e: TabPanelContentReadyEvent) => void)>, onDisposing: Function as PropType<((e: TabPanelDisposingEvent) => void)>, onInitialized: Function as PropType<((e: TabPanelInitializedEvent) => void)>, - onItemClick: Function as PropType<((e: ItemClickEvent) => void)>, + onItemClick: Function as PropType<((e: TabPanelItemClickEvent) => void)>, onItemContextMenu: Function as PropType<((e: ItemContextMenuEvent) => void)>, onItemHold: Function as PropType<((e: ItemHoldEvent) => void)>, onItemRendered: Function as PropType<((e: ItemRenderedEvent) => void)>, @@ -5600,6 +5718,8 @@ export { DxSpeechToTextOptions, DxStateStoring, DxStringLengthRule, + DxSuggestions, + DxSuggestionsItem, DxSummary, DxSummaryTexts, DxTab, diff --git a/packages/devextreme-vue/src/tree-list.ts b/packages/devextreme-vue/src/tree-list.ts index 8210dbadc766..42cd5c1ddf7f 100644 --- a/packages/devextreme-vue/src/tree-list.ts +++ b/packages/devextreme-vue/src/tree-list.ts @@ -287,6 +287,16 @@ import { StopClickEvent, SpeechRecognitionConfig, } from "devextreme/ui/speech_to_text"; +import { + dxButtonGroupOptions, + dxButtonGroupItem, + ContentReadyEvent as ButtonGroupContentReadyEvent, + DisposingEvent as ButtonGroupDisposingEvent, + InitializedEvent as ButtonGroupInitializedEvent, + ItemClickEvent, + OptionChangedEvent as ButtonGroupOptionChangedEvent, + SelectionChangedEvent as ButtonGroupSelectionChangedEvent, +} from "devextreme/ui/button_group"; import { event, } from "devextreme/events/events.types"; @@ -305,7 +315,7 @@ import { ContentReadyEvent as TabPanelContentReadyEvent, DisposingEvent as TabPanelDisposingEvent, InitializedEvent as TabPanelInitializedEvent, - ItemClickEvent, + ItemClickEvent as TabPanelItemClickEvent, ItemContextMenuEvent, ItemHoldEvent, ItemRenderedEvent, @@ -1191,6 +1201,7 @@ const DxChatConfig = { "update:showUserName": null, "update:speechToTextEnabled": null, "update:speechToTextOptions": null, + "update:suggestions": null, "update:typingUsers": null, "update:user": null, "update:visible": null, @@ -1238,6 +1249,7 @@ const DxChatConfig = { showUserName: Boolean, speechToTextEnabled: Boolean, speechToTextOptions: Object as PropType>, + suggestions: Object as PropType>, typingUsers: Array as PropType>, user: Object as PropType>, visible: Boolean, @@ -1261,6 +1273,7 @@ const DxChat = defineComponent(DxChatConfig); messageTimestampFormat: { isCollectionItem: false, optionName: "messageTimestampFormat" }, sendButtonOptions: { isCollectionItem: false, optionName: "sendButtonOptions" }, speechToTextOptions: { isCollectionItem: false, optionName: "speechToTextOptions" }, + suggestions: { isCollectionItem: false, optionName: "suggestions" }, typingUser: { isCollectionItem: true, optionName: "typingUsers" }, user: { isCollectionItem: false, optionName: "user" } }; @@ -3169,7 +3182,9 @@ const DxItemConfig = { "update:disabled": null, "update:editorOptions": null, "update:editorType": null, + "update:elementAttr": null, "update:helpText": null, + "update:hint": null, "update:horizontalAlignment": null, "update:html": null, "update:icon": null, @@ -3219,7 +3234,9 @@ const DxItemConfig = { disabled: Boolean, editorOptions: {}, editorType: String as PropType, + elementAttr: Object as PropType>, helpText: String, + hint: String, horizontalAlignment: String as PropType, html: String, icon: String, @@ -3244,7 +3261,7 @@ const DxItemConfig = { text: String, timestamp: [Date, Number, String], title: String, - type: String, + type: String as PropType, validationRules: Array as PropType>, verticalAlignment: String as PropType, visible: Boolean, @@ -4375,6 +4392,107 @@ const DxStringLengthRule = defineComponent(DxStringLengthRuleConfig); type: "stringLength" }; +const DxSuggestionsConfig = { + emits: { + "update:isActive": null, + "update:hoveredElement": null, + "update:accessKey": null, + "update:activeStateEnabled": null, + "update:buttonTemplate": null, + "update:disabled": null, + "update:elementAttr": null, + "update:focusStateEnabled": null, + "update:height": null, + "update:hint": null, + "update:hoverStateEnabled": null, + "update:items": null, + "update:keyExpr": null, + "update:onContentReady": null, + "update:onDisposing": null, + "update:onInitialized": null, + "update:onItemClick": null, + "update:onOptionChanged": null, + "update:onSelectionChanged": null, + "update:rtlEnabled": null, + "update:selectedItemKeys": null, + "update:selectedItems": null, + "update:selectionMode": null, + "update:stylingMode": null, + "update:tabIndex": null, + "update:visible": null, + "update:width": null, + }, + props: { + accessKey: String, + activeStateEnabled: Boolean, + buttonTemplate: {}, + disabled: Boolean, + elementAttr: Object as PropType>, + focusStateEnabled: Boolean, + height: [Number, String], + hint: String, + hoverStateEnabled: Boolean, + items: Array as PropType>, + keyExpr: [Function, String] as PropType<((() => void)) | string>, + onContentReady: Function as PropType<((e: ButtonGroupContentReadyEvent) => void)>, + onDisposing: Function as PropType<((e: ButtonGroupDisposingEvent) => void)>, + onInitialized: Function as PropType<((e: ButtonGroupInitializedEvent) => void)>, + onItemClick: Function as PropType<((e: ItemClickEvent) => void)>, + onOptionChanged: Function as PropType<((e: ButtonGroupOptionChangedEvent) => void)>, + onSelectionChanged: Function as PropType<((e: ButtonGroupSelectionChangedEvent) => void)>, + rtlEnabled: Boolean, + selectedItemKeys: Array as PropType>, + selectedItems: Array as PropType>, + selectionMode: String as PropType, + stylingMode: String as PropType, + tabIndex: Number, + visible: Boolean, + width: [Number, String] + } +}; + +prepareConfigurationComponentConfig(DxSuggestionsConfig); + +const DxSuggestions = defineComponent(DxSuggestionsConfig); + +(DxSuggestions as any).$_optionName = "suggestions"; +(DxSuggestions as any).$_expectedChildren = { + item: { isCollectionItem: true, optionName: "items" }, + suggestionsItem: { isCollectionItem: true, optionName: "items" } +}; + +const DxSuggestionsItemConfig = { + emits: { + "update:isActive": null, + "update:hoveredElement": null, + "update:disabled": null, + "update:elementAttr": null, + "update:hint": null, + "update:icon": null, + "update:template": null, + "update:text": null, + "update:type": null, + "update:visible": null, + }, + props: { + disabled: Boolean, + elementAttr: Object as PropType>, + hint: String, + icon: String, + template: {}, + text: String, + type: String as PropType, + visible: Boolean + } +}; + +prepareConfigurationComponentConfig(DxSuggestionsItemConfig); + +const DxSuggestionsItem = defineComponent(DxSuggestionsItemConfig); + +(DxSuggestionsItem as any).$_optionName = "items"; +(DxSuggestionsItem as any).$_isCollectionItem = true; + const DxTabConfig = { emits: { "update:isActive": null, @@ -4526,7 +4644,7 @@ const DxTabPanelOptionsConfig = { onContentReady: Function as PropType<((e: TabPanelContentReadyEvent) => void)>, onDisposing: Function as PropType<((e: TabPanelDisposingEvent) => void)>, onInitialized: Function as PropType<((e: TabPanelInitializedEvent) => void)>, - onItemClick: Function as PropType<((e: ItemClickEvent) => void)>, + onItemClick: Function as PropType<((e: TabPanelItemClickEvent) => void)>, onItemContextMenu: Function as PropType<((e: ItemContextMenuEvent) => void)>, onItemHold: Function as PropType<((e: ItemHoldEvent) => void)>, onItemRendered: Function as PropType<((e: ItemRenderedEvent) => void)>, @@ -5169,6 +5287,8 @@ export { DxSpeechToTextOptions, DxStateStoring, DxStringLengthRule, + DxSuggestions, + DxSuggestionsItem, DxTab, DxTabbedItem, DxTabPanelOptions,