devextreme-angular
Version:
DevExtreme UI and Visualization Components for Angular
1 lines • 152 kB
Source Map (JSON)
{"version":3,"file":"devextreme-angular-ui-data-grid.mjs","sources":["../../../dist/ui/data-grid/index.ts","../../../dist/ui/data-grid/devextreme-angular-ui-data-grid.ts"],"sourcesContent":["/*!\n * devextreme-angular\n * Version: 26.1.3\n * Build date: Wed Jun 10 2026\n *\n * Copyright (c) 2012 - 2026 Developer Express Inc. ALL RIGHTS RESERVED\n *\n * This software may be modified and distributed under the terms\n * of the MIT license. See the LICENSE file in the root of the project for details.\n *\n * https://github.com/DevExpress/DevExtreme\n */\n\n/* tslint:disable:max-line-length */\n\n\nimport {\n TransferState,\n Component,\n NgModule,\n ElementRef,\n NgZone,\n PLATFORM_ID,\n Inject,\n\n Input,\n Output,\n OnDestroy,\n EventEmitter,\n OnChanges,\n DoCheck,\n SimpleChanges,\n ContentChildren,\n QueryList\n} from '@angular/core';\n\nexport type { ExplicitTypes } from 'devextreme/ui/data_grid';\n\nimport type dxSortable from 'devextreme/ui/sortable';\nimport type dxDraggable from 'devextreme/ui/draggable';\nimport 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';\nimport type { AIIntegration } from 'devextreme/common/ai-integration';\nimport 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';\nimport type { Mode, DragDirection, DragHighlight, ScrollbarMode, SingleMultipleOrNone, SelectAllMode, SortOrder, HorizontalAlignment } from 'devextreme/common';\nimport type { default as DataSource, DataSourceOptions } from 'devextreme/data/data_source';\nimport type { Store } from 'devextreme/data/store';\nimport type { dxFormOptions } from 'devextreme/ui/form';\nimport type { dxPopupOptions } from 'devextreme/ui/popup';\nimport type { dxFilterBuilderOptions } from 'devextreme/ui/filter_builder';\nimport type { LoadPanelIndicatorProperties } from 'devextreme/ui/load_panel';\nimport type { event } from 'devextreme/events/events.types';\nimport type { Format } from 'devextreme/common/core/localization';\n\nimport DxDataGrid from 'devextreme/ui/data_grid';\n\n\nimport {\n DxComponent,\n DxTemplateHost,\n DxIntegrationModule,\n DxTemplateModule,\n NestedOptionHost,\n IterableDifferHelper,\n WatcherHelper,\n CollectionNestedOption,\n} from 'devextreme-angular/core';\n\nimport { DxoColumnChooserModule } from 'devextreme-angular/ui/nested';\nimport { DxoPositionModule } from 'devextreme-angular/ui/nested';\nimport { DxoAtModule } from 'devextreme-angular/ui/nested';\nimport { DxoBoundaryOffsetModule } from 'devextreme-angular/ui/nested';\nimport { DxoCollisionModule } from 'devextreme-angular/ui/nested';\nimport { DxoMyModule } from 'devextreme-angular/ui/nested';\nimport { DxoOffsetModule } from 'devextreme-angular/ui/nested';\nimport { DxoSearchModule } from 'devextreme-angular/ui/nested';\nimport { DxoSelectionModule } from 'devextreme-angular/ui/nested';\nimport { DxoColumnFixingModule } from 'devextreme-angular/ui/nested';\nimport { DxoIconsModule } from 'devextreme-angular/ui/nested';\nimport { DxoTextsModule } from 'devextreme-angular/ui/nested';\nimport { DxiColumnModule } from 'devextreme-angular/ui/nested';\nimport { DxiButtonModule } from 'devextreme-angular/ui/nested';\nimport { DxoLookupModule } from 'devextreme-angular/ui/nested';\nimport { DxoFormatModule } from 'devextreme-angular/ui/nested';\nimport { DxoFormItemModule } from 'devextreme-angular/ui/nested';\nimport { DxoLabelModule } from 'devextreme-angular/ui/nested';\nimport { DxiValidationRuleModule } from 'devextreme-angular/ui/nested';\nimport { DxoHeaderFilterModule } from 'devextreme-angular/ui/nested';\nimport { DxoEditingModule } from 'devextreme-angular/ui/nested';\nimport { DxiChangeModule } from 'devextreme-angular/ui/nested';\nimport { DxoFormModule } from 'devextreme-angular/ui/nested';\nimport { DxoColCountByScreenModule } from 'devextreme-angular/ui/nested';\nimport { DxiItemModule } from 'devextreme-angular/ui/nested';\nimport { DxoTabPanelOptionsModule } from 'devextreme-angular/ui/nested';\nimport { DxiTabModule } from 'devextreme-angular/ui/nested';\nimport { DxoButtonOptionsModule } from 'devextreme-angular/ui/nested';\nimport { DxoPopupModule } from 'devextreme-angular/ui/nested';\nimport { DxoAnimationModule } from 'devextreme-angular/ui/nested';\nimport { DxoHideModule } from 'devextreme-angular/ui/nested';\nimport { DxoFromModule } from 'devextreme-angular/ui/nested';\nimport { DxoToModule } from 'devextreme-angular/ui/nested';\nimport { DxoShowModule } from 'devextreme-angular/ui/nested';\nimport { DxoExportModule } from 'devextreme-angular/ui/nested';\nimport { DxoFilterBuilderModule } from 'devextreme-angular/ui/nested';\nimport { DxiCustomOperationModule } from 'devextreme-angular/ui/nested';\nimport { DxiFieldModule } from 'devextreme-angular/ui/nested';\nimport { DxoFilterOperationDescriptionsModule } from 'devextreme-angular/ui/nested';\nimport { DxoGroupOperationDescriptionsModule } from 'devextreme-angular/ui/nested';\nimport { DxoFilterBuilderPopupModule } from 'devextreme-angular/ui/nested';\nimport { DxoFilterPanelModule } from 'devextreme-angular/ui/nested';\nimport { DxoFilterRowModule } from 'devextreme-angular/ui/nested';\nimport { DxoOperationDescriptionsModule } from 'devextreme-angular/ui/nested';\nimport { DxoGroupingModule } from 'devextreme-angular/ui/nested';\nimport { DxoGroupPanelModule } from 'devextreme-angular/ui/nested';\nimport { DxoKeyboardNavigationModule } from 'devextreme-angular/ui/nested';\nimport { DxoLoadPanelModule } from 'devextreme-angular/ui/nested';\nimport { DxoMasterDetailModule } from 'devextreme-angular/ui/nested';\nimport { DxoPagerModule } from 'devextreme-angular/ui/nested';\nimport { DxoPagingModule } from 'devextreme-angular/ui/nested';\nimport { DxoRemoteOperationsModule } from 'devextreme-angular/ui/nested';\nimport { DxoRowDraggingModule } from 'devextreme-angular/ui/nested';\nimport { DxoCursorOffsetModule } from 'devextreme-angular/ui/nested';\nimport { DxoScrollingModule } from 'devextreme-angular/ui/nested';\nimport { DxoSearchPanelModule } from 'devextreme-angular/ui/nested';\nimport { DxiSortByGroupSummaryInfoModule } from 'devextreme-angular/ui/nested';\nimport { DxoSortingModule } from 'devextreme-angular/ui/nested';\nimport { DxoStateStoringModule } from 'devextreme-angular/ui/nested';\nimport { DxoSummaryModule } from 'devextreme-angular/ui/nested';\nimport { DxiGroupItemModule } from 'devextreme-angular/ui/nested';\nimport { DxoValueFormatModule } from 'devextreme-angular/ui/nested';\nimport { DxiTotalItemModule } from 'devextreme-angular/ui/nested';\nimport { DxoToolbarModule } from 'devextreme-angular/ui/nested';\n\nimport { DxoDataGridAIModule } from 'devextreme-angular/ui/data-grid/nested';\nimport { DxoDataGridAIAssistantModule } from 'devextreme-angular/ui/data-grid/nested';\nimport { DxoDataGridAIOptionsModule } from 'devextreme-angular/ui/data-grid/nested';\nimport { DxoDataGridAnimationModule } from 'devextreme-angular/ui/data-grid/nested';\nimport { DxiDataGridAsyncRuleModule } from 'devextreme-angular/ui/data-grid/nested';\nimport { DxoDataGridAtModule } from 'devextreme-angular/ui/data-grid/nested';\nimport { DxoDataGridBoundaryOffsetModule } from 'devextreme-angular/ui/data-grid/nested';\nimport { DxiDataGridButtonModule } from 'devextreme-angular/ui/data-grid/nested';\nimport { DxiDataGridButtonItemModule } from 'devextreme-angular/ui/data-grid/nested';\nimport { DxoDataGridButtonOptionsModule } from 'devextreme-angular/ui/data-grid/nested';\nimport { DxiDataGridChangeModule } from 'devextreme-angular/ui/data-grid/nested';\nimport { DxoDataGridColCountByScreenModule } from 'devextreme-angular/ui/data-grid/nested';\nimport { DxoDataGridCollisionModule } from 'devextreme-angular/ui/data-grid/nested';\nimport { DxiDataGridColumnModule } from 'devextreme-angular/ui/data-grid/nested';\nimport { DxiDataGridColumnButtonModule } from 'devextreme-angular/ui/data-grid/nested';\nimport { DxoDataGridColumnChooserModule } from 'devextreme-angular/ui/data-grid/nested';\nimport { DxoDataGridColumnChooserSearchModule } from 'devextreme-angular/ui/data-grid/nested';\nimport { DxoDataGridColumnChooserSelectionModule } from 'devextreme-angular/ui/data-grid/nested';\nimport { DxoDataGridColumnFixingModule } from 'devextreme-angular/ui/data-grid/nested';\nimport { DxoDataGridColumnFixingTextsModule } from 'devextreme-angular/ui/data-grid/nested';\nimport { DxoDataGridColumnHeaderFilterModule } from 'devextreme-angular/ui/data-grid/nested';\nimport { DxoDataGridColumnHeaderFilterSearchModule } from 'devextreme-angular/ui/data-grid/nested';\nimport { DxoDataGridColumnLookupModule } from 'devextreme-angular/ui/data-grid/nested';\nimport { DxiDataGridCompareRuleModule } from 'devextreme-angular/ui/data-grid/nested';\nimport { DxoDataGridCursorOffsetModule } from 'devextreme-angular/ui/data-grid/nested';\nimport { DxiDataGridCustomOperationModule } from 'devextreme-angular/ui/data-grid/nested';\nimport { DxiDataGridCustomRuleModule } from 'devextreme-angular/ui/data-grid/nested';\nimport { DxoDataGridDataGridHeaderFilterModule } from 'devextreme-angular/ui/data-grid/nested';\nimport { DxoDataGridDataGridHeaderFilterSearchModule } from 'devextreme-angular/ui/data-grid/nested';\nimport { DxoDataGridDataGridHeaderFilterTextsModule } from 'devextreme-angular/ui/data-grid/nested';\nimport { DxoDataGridDataGridSelectionModule } from 'devextreme-angular/ui/data-grid/nested';\nimport { DxiDataGridDataGridToolbarItemModule } from 'devextreme-angular/ui/data-grid/nested';\nimport { DxoDataGridEditingModule } from 'devextreme-angular/ui/data-grid/nested';\nimport { DxoDataGridEditingTextsModule } from 'devextreme-angular/ui/data-grid/nested';\nimport { DxoDataGridEditorOptionsModule } from 'devextreme-angular/ui/data-grid/nested';\nimport { DxiDataGridEditorOptionsButtonModule } from 'devextreme-angular/ui/data-grid/nested';\nimport { DxiDataGridEmailRuleModule } from 'devextreme-angular/ui/data-grid/nested';\nimport { DxiDataGridEmptyItemModule } from 'devextreme-angular/ui/data-grid/nested';\nimport { DxoDataGridExportModule } from 'devextreme-angular/ui/data-grid/nested';\nimport { DxoDataGridExportTextsModule } from 'devextreme-angular/ui/data-grid/nested';\nimport { DxiDataGridFieldModule } from 'devextreme-angular/ui/data-grid/nested';\nimport { DxoDataGridFieldLookupModule } from 'devextreme-angular/ui/data-grid/nested';\nimport { DxoDataGridFilterBuilderModule } from 'devextreme-angular/ui/data-grid/nested';\nimport { DxoDataGridFilterBuilderPopupModule } from 'devextreme-angular/ui/data-grid/nested';\nimport { DxoDataGridFilterOperationDescriptionsModule } from 'devextreme-angular/ui/data-grid/nested';\nimport { DxoDataGridFilterPanelModule } from 'devextreme-angular/ui/data-grid/nested';\nimport { DxoDataGridFilterPanelTextsModule } from 'devextreme-angular/ui/data-grid/nested';\nimport { DxoDataGridFilterRowModule } from 'devextreme-angular/ui/data-grid/nested';\nimport { DxoDataGridFormModule } from 'devextreme-angular/ui/data-grid/nested';\nimport { DxoDataGridFormatModule } from 'devextreme-angular/ui/data-grid/nested';\nimport { DxiDataGridFormGroupItemModule } from 'devextreme-angular/ui/data-grid/nested';\nimport { DxoDataGridFormItemModule } from 'devextreme-angular/ui/data-grid/nested';\nimport { DxoDataGridFromModule } from 'devextreme-angular/ui/data-grid/nested';\nimport { DxoDataGridGroupingModule } from 'devextreme-angular/ui/data-grid/nested';\nimport { DxoDataGridGroupingTextsModule } from 'devextreme-angular/ui/data-grid/nested';\nimport { DxiDataGridGroupItemModule } from 'devextreme-angular/ui/data-grid/nested';\nimport { DxoDataGridGroupOperationDescriptionsModule } from 'devextreme-angular/ui/data-grid/nested';\nimport { DxoDataGridGroupPanelModule } from 'devextreme-angular/ui/data-grid/nested';\nimport { DxoDataGridHeaderFilterModule } from 'devextreme-angular/ui/data-grid/nested';\nimport { DxoDataGridHideModule } from 'devextreme-angular/ui/data-grid/nested';\nimport { DxoDataGridIconsModule } from 'devextreme-angular/ui/data-grid/nested';\nimport { DxoDataGridIndicatorOptionsModule } from 'devextreme-angular/ui/data-grid/nested';\nimport { DxiDataGridItemModule } from 'devextreme-angular/ui/data-grid/nested';\nimport { DxoDataGridKeyboardNavigationModule } from 'devextreme-angular/ui/data-grid/nested';\nimport { DxoDataGridLabelModule } from 'devextreme-angular/ui/data-grid/nested';\nimport { DxoDataGridLoadPanelModule } from 'devextreme-angular/ui/data-grid/nested';\nimport { DxoDataGridLookupModule } from 'devextreme-angular/ui/data-grid/nested';\nimport { DxoDataGridMasterDetailModule } from 'devextreme-angular/ui/data-grid/nested';\nimport { DxoDataGridMyModule } from 'devextreme-angular/ui/data-grid/nested';\nimport { DxiDataGridNumericRuleModule } from 'devextreme-angular/ui/data-grid/nested';\nimport { DxoDataGridOffsetModule } from 'devextreme-angular/ui/data-grid/nested';\nimport { DxoDataGridOperationDescriptionsModule } from 'devextreme-angular/ui/data-grid/nested';\nimport { DxoDataGridOptionsModule } from 'devextreme-angular/ui/data-grid/nested';\nimport { DxoDataGridPagerModule } from 'devextreme-angular/ui/data-grid/nested';\nimport { DxoDataGridPagingModule } from 'devextreme-angular/ui/data-grid/nested';\nimport { DxiDataGridPatternRuleModule } from 'devextreme-angular/ui/data-grid/nested';\nimport { DxoDataGridPopupModule } from 'devextreme-angular/ui/data-grid/nested';\nimport { DxoDataGridPositionModule } from 'devextreme-angular/ui/data-grid/nested';\nimport { DxiDataGridRangeRuleModule } from 'devextreme-angular/ui/data-grid/nested';\nimport { DxoDataGridRemoteOperationsModule } from 'devextreme-angular/ui/data-grid/nested';\nimport { DxiDataGridRequiredRuleModule } from 'devextreme-angular/ui/data-grid/nested';\nimport { DxoDataGridRowDraggingModule } from 'devextreme-angular/ui/data-grid/nested';\nimport { DxoDataGridScrollingModule } from 'devextreme-angular/ui/data-grid/nested';\nimport { DxoDataGridSearchModule } from 'devextreme-angular/ui/data-grid/nested';\nimport { DxoDataGridSearchPanelModule } from 'devextreme-angular/ui/data-grid/nested';\nimport { DxoDataGridSelectionModule } from 'devextreme-angular/ui/data-grid/nested';\nimport { DxoDataGridShowModule } from 'devextreme-angular/ui/data-grid/nested';\nimport { DxiDataGridSimpleItemModule } from 'devextreme-angular/ui/data-grid/nested';\nimport { DxiDataGridSortByGroupSummaryInfoModule } from 'devextreme-angular/ui/data-grid/nested';\nimport { DxoDataGridSortingModule } from 'devextreme-angular/ui/data-grid/nested';\nimport { DxoDataGridStateStoringModule } from 'devextreme-angular/ui/data-grid/nested';\nimport { DxiDataGridStringLengthRuleModule } from 'devextreme-angular/ui/data-grid/nested';\nimport { DxoDataGridSummaryModule } from 'devextreme-angular/ui/data-grid/nested';\nimport { DxoDataGridSummaryTextsModule } from 'devextreme-angular/ui/data-grid/nested';\nimport { DxiDataGridTabModule } from 'devextreme-angular/ui/data-grid/nested';\nimport { DxiDataGridTabbedItemModule } from 'devextreme-angular/ui/data-grid/nested';\nimport { DxoDataGridTabPanelOptionsModule } from 'devextreme-angular/ui/data-grid/nested';\nimport { DxiDataGridTabPanelOptionsItemModule } from 'devextreme-angular/ui/data-grid/nested';\nimport { DxoDataGridTextsModule } from 'devextreme-angular/ui/data-grid/nested';\nimport { DxoDataGridToModule } from 'devextreme-angular/ui/data-grid/nested';\nimport { DxoDataGridToolbarModule } from 'devextreme-angular/ui/data-grid/nested';\nimport { DxiDataGridToolbarItemModule } from 'devextreme-angular/ui/data-grid/nested';\nimport { DxiDataGridTotalItemModule } from 'devextreme-angular/ui/data-grid/nested';\nimport { DxiDataGridValidationRuleModule } from 'devextreme-angular/ui/data-grid/nested';\nimport { DxoDataGridValueFormatModule } from 'devextreme-angular/ui/data-grid/nested';\nimport { \n PROPERTY_TOKEN_validationRules,\n PROPERTY_TOKEN_buttons,\n PROPERTY_TOKEN_items,\n PROPERTY_TOKEN_changes,\n PROPERTY_TOKEN_columns,\n PROPERTY_TOKEN_customOperations,\n PROPERTY_TOKEN_fields,\n PROPERTY_TOKEN_groupItems,\n PROPERTY_TOKEN_sortByGroupSummaryInfo,\n PROPERTY_TOKEN_tabs,\n PROPERTY_TOKEN_toolbarItems,\n PROPERTY_TOKEN_totalItems,\n } from 'devextreme-angular/core/tokens';\n\n\n/**\n * The DataGrid is a UI component that represents data from a local or remote source in the form of a grid. This UI component offers such basic features as sorting, grouping, filtering, as well as more advanced capabilities, like state storing, client-side exporting, master-detail interface, and many others.\n\n */\n@Component({\n selector: 'dx-data-grid',\n template: '',\n host: { ngSkipHydration: 'true' },\n imports: [ DxIntegrationModule ],\n providers: [\n DxTemplateHost,\n WatcherHelper,\n NestedOptionHost,\n IterableDifferHelper\n ]\n})\nexport class DxDataGridComponent<TRowData = any, TKey = any> extends DxComponent implements OnDestroy, OnChanges, DoCheck {\n\n @ContentChildren(PROPERTY_TOKEN_validationRules)\n set _validationRulesContentChildren(value: QueryList<CollectionNestedOption>) {\n this.setChildren('validationRules', value);\n }\n\n @ContentChildren(PROPERTY_TOKEN_buttons)\n set _buttonsContentChildren(value: QueryList<CollectionNestedOption>) {\n this.setChildren('buttons', value);\n }\n\n @ContentChildren(PROPERTY_TOKEN_items)\n set _itemsContentChildren(value: QueryList<CollectionNestedOption>) {\n this.setChildren('items', value);\n }\n\n @ContentChildren(PROPERTY_TOKEN_changes)\n set _changesContentChildren(value: QueryList<CollectionNestedOption>) {\n this.setChildren('changes', value);\n }\n\n @ContentChildren(PROPERTY_TOKEN_columns)\n set _columnsContentChildren(value: QueryList<CollectionNestedOption>) {\n this.setChildren('columns', value);\n }\n\n @ContentChildren(PROPERTY_TOKEN_customOperations)\n set _customOperationsContentChildren(value: QueryList<CollectionNestedOption>) {\n this.setChildren('customOperations', value);\n }\n\n @ContentChildren(PROPERTY_TOKEN_fields)\n set _fieldsContentChildren(value: QueryList<CollectionNestedOption>) {\n this.setChildren('fields', value);\n }\n\n @ContentChildren(PROPERTY_TOKEN_groupItems)\n set _groupItemsContentChildren(value: QueryList<CollectionNestedOption>) {\n this.setChildren('groupItems', value);\n }\n\n @ContentChildren(PROPERTY_TOKEN_sortByGroupSummaryInfo)\n set _sortByGroupSummaryInfoContentChildren(value: QueryList<CollectionNestedOption>) {\n this.setChildren('sortByGroupSummaryInfo', value);\n }\n\n @ContentChildren(PROPERTY_TOKEN_tabs)\n set _tabsContentChildren(value: QueryList<CollectionNestedOption>) {\n this.setChildren('tabs', value);\n }\n\n @ContentChildren(PROPERTY_TOKEN_toolbarItems)\n set _toolbarItemsContentChildren(value: QueryList<CollectionNestedOption>) {\n this.setChildren('toolbarItems', value);\n }\n\n @ContentChildren(PROPERTY_TOKEN_totalItems)\n set _totalItemsContentChildren(value: QueryList<CollectionNestedOption>) {\n this.setChildren('totalItems', value);\n }\n\n instance: DxDataGrid<TRowData, TKey> = null;\n\n /**\n * Specifies the shortcut key that sets focus on the UI component.\n \n */\n @Input()\n get accessKey(): string | undefined {\n return this._getOption('accessKey');\n }\n set accessKey(value: string | undefined) {\n this._setOption('accessKey', value);\n }\n\n\n /**\n * Specifies whether the UI component changes its visual state as a result of user interaction.\n \n */\n @Input()\n get activeStateEnabled(): boolean {\n return this._getOption('activeStateEnabled');\n }\n set activeStateEnabled(value: boolean) {\n this._setOption('activeStateEnabled', value);\n }\n\n\n /**\n * Configures the widget AI Assistant.\n \n */\n @Input()\n get aiAssistant(): AIAssistant {\n return this._getOption('aiAssistant');\n }\n set aiAssistant(value: AIAssistant) {\n this._setOption('aiAssistant', value);\n }\n\n\n /**\n * Binds the widget to an AI service.\n \n */\n @Input()\n get aiIntegration(): AIIntegration | undefined {\n return this._getOption('aiIntegration');\n }\n set aiIntegration(value: AIIntegration | undefined) {\n this._setOption('aiIntegration', value);\n }\n\n\n /**\n * Specifies whether a user can reorder columns.\n \n */\n @Input()\n get allowColumnReordering(): boolean {\n return this._getOption('allowColumnReordering');\n }\n set allowColumnReordering(value: boolean) {\n this._setOption('allowColumnReordering', value);\n }\n\n\n /**\n * Enables column resizing.\n \n */\n @Input()\n get allowColumnResizing(): boolean {\n return this._getOption('allowColumnResizing');\n }\n set allowColumnResizing(value: boolean) {\n this._setOption('allowColumnResizing', value);\n }\n\n\n /**\n * Automatically scrolls the component to the focused row when the focusedRowKey is changed.\n \n */\n @Input()\n get autoNavigateToFocusedRow(): boolean {\n return this._getOption('autoNavigateToFocusedRow');\n }\n set autoNavigateToFocusedRow(value: boolean) {\n this._setOption('autoNavigateToFocusedRow', value);\n }\n\n\n /**\n * Specifies whether data should be cached.\n \n */\n @Input()\n get cacheEnabled(): boolean {\n return this._getOption('cacheEnabled');\n }\n set cacheEnabled(value: boolean) {\n this._setOption('cacheEnabled', value);\n }\n\n\n /**\n * Enables a hint that appears when a user hovers the mouse pointer over a cell with truncated content.\n \n */\n @Input()\n get cellHintEnabled(): boolean {\n return this._getOption('cellHintEnabled');\n }\n set cellHintEnabled(value: boolean) {\n this._setOption('cellHintEnabled', value);\n }\n\n\n /**\n * Specifies if the component adjusts column widths to fit content.\n \n */\n @Input()\n get columnAutoWidth(): boolean {\n return this._getOption('columnAutoWidth');\n }\n set columnAutoWidth(value: boolean) {\n this._setOption('columnAutoWidth', value);\n }\n\n\n /**\n * Configures the column chooser.\n \n */\n @Input()\n get columnChooser(): ColumnChooser {\n return this._getOption('columnChooser');\n }\n set columnChooser(value: ColumnChooser) {\n this._setOption('columnChooser', value);\n }\n\n\n /**\n * Configures column fixing.\n \n */\n @Input()\n get columnFixing(): { enabled?: boolean, icons?: { fix?: string, leftPosition?: string, rightPosition?: string, stickyPosition?: string, unfix?: string }, texts?: { fix?: string, leftPosition?: string, rightPosition?: string, stickyPosition?: string, unfix?: string } } {\n return this._getOption('columnFixing');\n }\n set columnFixing(value: { enabled?: boolean, icons?: { fix?: string, leftPosition?: string, rightPosition?: string, stickyPosition?: string, unfix?: string }, texts?: { fix?: string, leftPosition?: string, rightPosition?: string, stickyPosition?: string, unfix?: string } }) {\n this._setOption('columnFixing', value);\n }\n\n\n /**\n * Specifies whether the UI component hides columns to adapt to the screen or container size. Ignored if allowColumnResizing is `true` and columnResizingMode is 'widget'.\n \n */\n @Input()\n get columnHidingEnabled(): boolean {\n return this._getOption('columnHidingEnabled');\n }\n set columnHidingEnabled(value: boolean) {\n this._setOption('columnHidingEnabled', value);\n }\n\n\n /**\n * Specifies the minimum width of columns.\n \n */\n @Input()\n get columnMinWidth(): number | undefined {\n return this._getOption('columnMinWidth');\n }\n set columnMinWidth(value: number | undefined) {\n this._setOption('columnMinWidth', value);\n }\n\n\n /**\n * Specifies how the UI component resizes columns. Applies only if allowColumnResizing is true.\n \n */\n @Input()\n get columnResizingMode(): ColumnResizeMode {\n return this._getOption('columnResizingMode');\n }\n set columnResizingMode(value: ColumnResizeMode) {\n this._setOption('columnResizingMode', value);\n }\n\n\n /**\n * An array of grid columns.\n \n */\n @Input()\n get columns(): Array<dxDataGridColumn | string> {\n return this._getOption('columns');\n }\n set columns(value: Array<dxDataGridColumn | string>) {\n this._setOption('columns', value);\n }\n\n\n /**\n * Specifies the width for all data columns. Has a lower priority than the column.width property.\n \n */\n @Input()\n get columnWidth(): Mode | number | undefined {\n return this._getOption('columnWidth');\n }\n set columnWidth(value: Mode | number | undefined) {\n this._setOption('columnWidth', value);\n }\n\n\n /**\n * Customizes columns after they are created.\n \n */\n @Input()\n get customizeColumns(): ((columns: Array<dxDataGridColumn>) => void) {\n return this._getOption('customizeColumns');\n }\n set customizeColumns(value: ((columns: Array<dxDataGridColumn>) => void)) {\n this._setOption('customizeColumns', value);\n }\n\n\n /**\n * Specifies a custom template for data rows.\n \n */\n @Input()\n get dataRowTemplate(): any {\n return this._getOption('dataRowTemplate');\n }\n set dataRowTemplate(value: any) {\n this._setOption('dataRowTemplate', value);\n }\n\n\n /**\n * Binds the UI component to data.\n \n */\n @Input()\n get dataSource(): Array<any> | DataSource | DataSourceOptions | null | Store | string {\n return this._getOption('dataSource');\n }\n set dataSource(value: Array<any> | DataSource | DataSourceOptions | null | Store | string) {\n this._setOption('dataSource', value);\n }\n\n\n /**\n * Specifies the format in which date-time values should be sent to the server.\n \n */\n @Input()\n get dateSerializationFormat(): string {\n return this._getOption('dateSerializationFormat');\n }\n set dateSerializationFormat(value: string) {\n this._setOption('dateSerializationFormat', value);\n }\n\n\n /**\n * Specifies whether the UI component responds to user interaction.\n \n */\n @Input()\n get disabled(): boolean {\n return this._getOption('disabled');\n }\n set disabled(value: boolean) {\n this._setOption('disabled', value);\n }\n\n\n /**\n * Configures editing.\n \n */\n @Input()\n get editing(): { allowAdding?: boolean, allowDeleting?: boolean | ((options: { component: dxDataGrid, row: dxDataGridRowObject }) => boolean), allowUpdating?: boolean | ((options: { component: dxDataGrid, row: dxDataGridRowObject }) => boolean), changes?: Array<DataChange>, confirmDelete?: boolean, editColumnName?: string, editRowKey?: any, form?: dxFormOptions, mode?: GridsEditMode, newRowPosition?: NewRowPosition, popup?: dxPopupOptions<any>, 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 } {\n return this._getOption('editing');\n }\n set editing(value: { allowAdding?: boolean, allowDeleting?: boolean | ((options: { component: dxDataGrid, row: dxDataGridRowObject }) => boolean), allowUpdating?: boolean | ((options: { component: dxDataGrid, row: dxDataGridRowObject }) => boolean), changes?: Array<DataChange>, confirmDelete?: boolean, editColumnName?: string, editRowKey?: any, form?: dxFormOptions, mode?: GridsEditMode, newRowPosition?: NewRowPosition, popup?: dxPopupOptions<any>, 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 }) {\n this._setOption('editing', value);\n }\n\n\n /**\n * Specifies the global attributes to be attached to the UI component's container element.\n \n */\n @Input()\n get elementAttr(): Record<string, any> {\n return this._getOption('elementAttr');\n }\n set elementAttr(value: Record<string, any>) {\n this._setOption('elementAttr', value);\n }\n\n\n /**\n * Indicates whether to show the error row.\n \n */\n @Input()\n get errorRowEnabled(): boolean {\n return this._getOption('errorRowEnabled');\n }\n set errorRowEnabled(value: boolean) {\n this._setOption('errorRowEnabled', value);\n }\n\n\n /**\n * Configures client-side exporting.\n \n */\n @Input()\n get export(): { allowExportSelectedData?: boolean, enabled?: boolean, formats?: Array<DataGridExportFormat | string>, texts?: { exportAll?: string, exportSelectedRows?: string, exportTo?: string } } {\n return this._getOption('export');\n }\n set export(value: { allowExportSelectedData?: boolean, enabled?: boolean, formats?: Array<DataGridExportFormat | string>, texts?: { exportAll?: string, exportSelectedRows?: string, exportTo?: string } }) {\n this._setOption('export', value);\n }\n\n\n /**\n * Configures the integrated filter builder.\n \n */\n @Input()\n get filterBuilder(): dxFilterBuilderOptions {\n return this._getOption('filterBuilder');\n }\n set filterBuilder(value: dxFilterBuilderOptions) {\n this._setOption('filterBuilder', value);\n }\n\n\n /**\n * Configures the popup in which the integrated filter builder is shown.\n \n */\n @Input()\n get filterBuilderPopup(): dxPopupOptions<any> {\n return this._getOption('filterBuilderPopup');\n }\n set filterBuilderPopup(value: dxPopupOptions<any>) {\n this._setOption('filterBuilderPopup', value);\n }\n\n\n /**\n * Configures the filter panel.\n \n */\n @Input()\n get filterPanel(): FilterPanel {\n return this._getOption('filterPanel');\n }\n set filterPanel(value: FilterPanel) {\n this._setOption('filterPanel', value);\n }\n\n\n /**\n * Configures the filter row.\n \n */\n @Input()\n get filterRow(): { applyFilter?: ApplyFilterMode, applyFilterText?: string, betweenEndText?: string, betweenStartText?: string, operationDescriptions?: { between?: string, contains?: string, endsWith?: string, equal?: string, greaterThan?: string, greaterThanOrEqual?: string, lessThan?: string, lessThanOrEqual?: string, notContains?: string, notEqual?: string, startsWith?: string }, resetOperationText?: string, showAllText?: string, showOperationChooser?: boolean, visible?: boolean } {\n return this._getOption('filterRow');\n }\n set filterRow(value: { applyFilter?: ApplyFilterMode, applyFilterText?: string, betweenEndText?: string, betweenStartText?: string, operationDescriptions?: { between?: string, contains?: string, endsWith?: string, equal?: string, greaterThan?: string, greaterThanOrEqual?: string, lessThan?: string, lessThanOrEqual?: string, notContains?: string, notEqual?: string, startsWith?: string }, resetOperationText?: string, showAllText?: string, showOperationChooser?: boolean, visible?: boolean }) {\n this._setOption('filterRow', value);\n }\n\n\n /**\n * Specifies whether to synchronize the filter row, header filter, and filter builder. The synchronized filter expression is stored in the filterValue property.\n \n */\n @Input()\n get filterSyncEnabled(): boolean | Mode {\n return this._getOption('filterSyncEnabled');\n }\n set filterSyncEnabled(value: boolean | Mode) {\n this._setOption('filterSyncEnabled', value);\n }\n\n\n /**\n * Specifies a filter expression.\n \n */\n @Input()\n get filterValue(): Array<any> | Function | string {\n return this._getOption('filterValue');\n }\n set filterValue(value: Array<any> | Function | string) {\n this._setOption('filterValue', value);\n }\n\n\n /**\n * The index of the column that contains the focused data cell. This index is taken from the columns array.\n \n */\n @Input()\n get focusedColumnIndex(): number {\n return this._getOption('focusedColumnIndex');\n }\n set focusedColumnIndex(value: number) {\n this._setOption('focusedColumnIndex', value);\n }\n\n\n /**\n * Specifies whether the focused row feature is enabled.\n \n */\n @Input()\n get focusedRowEnabled(): boolean {\n return this._getOption('focusedRowEnabled');\n }\n set focusedRowEnabled(value: boolean) {\n this._setOption('focusedRowEnabled', value);\n }\n\n\n /**\n * Specifies or indicates the focused data row's index.\n \n */\n @Input()\n get focusedRowIndex(): number {\n return this._getOption('focusedRowIndex');\n }\n set focusedRowIndex(value: number) {\n this._setOption('focusedRowIndex', value);\n }\n\n\n /**\n * Specifies initially or currently focused grid row's key.\n \n */\n @Input()\n get focusedRowKey(): any | undefined {\n return this._getOption('focusedRowKey');\n }\n set focusedRowKey(value: any | undefined) {\n this._setOption('focusedRowKey', value);\n }\n\n\n /**\n * Configures grouping.\n \n */\n @Input()\n get grouping(): { allowCollapsing?: boolean, autoExpandAll?: boolean, contextMenuEnabled?: boolean, expandMode?: GroupExpandMode, texts?: { groupByThisColumn?: string, groupContinuedMessage?: string, groupContinuesMessage?: string, ungroup?: string, ungroupAll?: string } } {\n return this._getOption('grouping');\n }\n set grouping(value: { allowCollapsing?: boolean, autoExpandAll?: boolean, contextMenuEnabled?: boolean, expandMode?: GroupExpandMode, texts?: { groupByThisColumn?: string, groupContinuedMessage?: string, groupContinuesMessage?: string, ungroup?: string, ungroupAll?: string } }) {\n this._setOption('grouping', value);\n }\n\n\n /**\n * Configures the group panel.\n \n */\n @Input()\n get groupPanel(): { allowColumnDragging?: boolean, emptyPanelText?: string, visible?: boolean | Mode } {\n return this._getOption('groupPanel');\n }\n set groupPanel(value: { allowColumnDragging?: boolean, emptyPanelText?: string, visible?: boolean | Mode }) {\n this._setOption('groupPanel', value);\n }\n\n\n /**\n * Configures the header filter feature.\n \n */\n @Input()\n get headerFilter(): HeaderFilter {\n return this._getOption('headerFilter');\n }\n set headerFilter(value: HeaderFilter) {\n this._setOption('headerFilter', value);\n }\n\n\n /**\n * Specifies the UI component's height.\n \n */\n @Input()\n get height(): number | string | undefined {\n return this._getOption('height');\n }\n set height(value: number | string | undefined) {\n this._setOption('height', value);\n }\n\n\n /**\n * Specifies whether to highlight rows and cells with edited data. repaintChangesOnly should be true.\n \n */\n @Input()\n get highlightChanges(): boolean {\n return this._getOption('highlightChanges');\n }\n set highlightChanges(value: boolean) {\n this._setOption('highlightChanges', value);\n }\n\n\n /**\n * Specifies text for a hint that appears when a user pauses on the UI component.\n \n */\n @Input()\n get hint(): string | undefined {\n return this._getOption('hint');\n }\n set hint(value: string | undefined) {\n this._setOption('hint', value);\n }\n\n\n /**\n * Specifies whether the UI component changes its state when a user pauses on it.\n \n */\n @Input()\n get hoverStateEnabled(): boolean {\n return this._getOption('hoverStateEnabled');\n }\n set hoverStateEnabled(value: boolean) {\n this._setOption('hoverStateEnabled', value);\n }\n\n\n /**\n * Configures keyboard navigation.\n \n */\n @Input()\n get keyboardNavigation(): { editOnKeyPress?: boolean, enabled?: boolean, enterKeyAction?: EnterKeyAction, enterKeyDirection?: EnterKeyDirection } {\n return this._getOption('keyboardNavigation');\n }\n set keyboardNavigation(value: { editOnKeyPress?: boolean, enabled?: boolean, enterKeyAction?: EnterKeyAction, enterKeyDirection?: EnterKeyDirection }) {\n this._setOption('keyboardNavigation', value);\n }\n\n\n /**\n * Specifies the key property (or properties) that provide(s) key values to access data items. Each key value must be unique. This property applies only if data is a simple array.\n \n */\n @Input()\n get keyExpr(): Array<string> | string | undefined {\n return this._getOption('keyExpr');\n }\n set keyExpr(value: Array<string> | string | undefined) {\n this._setOption('keyExpr', value);\n }\n\n\n /**\n * Configures the load panel.\n \n */\n @Input()\n get loadPanel(): { enabled?: boolean | Mode, height?: number | string, indicatorOptions?: LoadPanelIndicatorProperties, indicatorSrc?: string, shading?: boolean, shadingColor?: string, showIndicator?: boolean, showPane?: boolean, text?: string, width?: number | string } {\n return this._getOption('loadPanel');\n }\n set loadPanel(value: { enabled?: boolean | Mode, height?: number | string, indicatorOptions?: LoadPanelIndicatorProperties, indicatorSrc?: string, shading?: boolean, shadingColor?: string, showIndicator?: boolean, showPane?: boolean, text?: string, width?: number | string }) {\n this._setOption('loadPanel', value);\n }\n\n\n /**\n * Allows you to build a master-detail interface in the grid.\n \n */\n @Input()\n get masterDetail(): { autoExpandAll?: boolean, enabled?: boolean, template?: any } {\n return this._getOption('masterDetail');\n }\n set masterDetail(value: { autoExpandAll?: boolean, enabled?: boolean, template?: any }) {\n this._setOption('masterDetail', value);\n }\n\n\n /**\n * Specifies a text string shown when the widget does not display any data.\n \n */\n @Input()\n get noDataText(): string {\n return this._getOption('noDataText');\n }\n set noDataText(value: string) {\n this._setOption('noDataText', value);\n }\n\n\n /**\n * Configures the pager.\n \n */\n @Input()\n get pager(): Pager {\n return this._getOption('pager');\n }\n set pager(value: Pager) {\n this._setOption('pager', value);\n }\n\n\n /**\n * Configures paging.\n \n */\n @Input()\n get paging(): { enabled?: boolean, pageIndex?: number, pageSize?: number } {\n return this._getOption('paging');\n }\n set paging(value: { enabled?: boolean, pageIndex?: number, pageSize?: number }) {\n this._setOption('paging', value);\n }\n\n\n /**\n * Specifies DataGrid operations to be executed on the server side.\n \n */\n @Input()\n get remoteOperations(): boolean | Mode | { filtering?: boolean, grouping?: boolean, groupPaging?: boolean, paging?: boolean, sorting?: boolean, summary?: boolean } {\n return this._getOption('remoteOperations');\n }\n set remoteOperations(value: boolean | Mode | { filtering?: boolean, grouping?: boolean, groupPaging?: boolean, paging?: boolean, sorting?: boolean, summary?: boolean }) {\n this._setOption('remoteOperations', value);\n }\n\n\n /**\n * Specifies whether to render the filter row, command columns, and columns with showEditorAlways set to true after other elements.\n \n */\n @Input()\n get renderAsync(): boolean {\n return this._getOption('renderAsync');\n }\n set renderAsync(value: boolean) {\n this._setOption('renderAsync', value);\n }\n\n\n /**\n * Specifies whether to repaint only those cells whose data changed.\n \n */\n @Input()\n get repaintChangesOnly(): boolean {\n return this._getOption('repaintChangesOnly');\n }\n set repaintChangesOnly(value: boolean) {\n this._setOption('repaintChangesOnly', value);\n }\n\n\n /**\n * Specifies whether rows should be shaded differently.\n \n */\n @Input()\n get rowAlternationEnabled(): boolean {\n return this._getOption('rowAlternationEnabled');\n }\n set rowAlternationEnabled(value: boolean) {\n this._setOption('rowAlternationEnabled', value);\n }\n\n\n /**\n * Configures row reordering using drag and drop gestures.\n \n */\n @Input()\n get rowDragging(): { allowDropInsideItem?: boolean, allowReordering?: boolean, autoScroll?: boolean, boundary?: any | string | undefined, container?: any | string | undefined, cursorOffset?: string | { x?: number, y?: number }, data?: any | undefined, dragDirection?: DragDirection, dragTemplate?: any, dropFeedbackMode?: DragHighlight, filter?: string, group?: string | undefined, handle?: string, onAdd?: ((e: { component: GridBase, dropInsideItem: boolean, event: event, fromComponent: dxSortable | dxDraggable, fromData: any, fromIndex: number, itemData: any, itemElement: any, toComponent: dxSortable | dxDraggable, toData: any, toIndex: number }) => void), onDragChange?: ((e: { cancel: boolean, component: GridBase, dropInsideItem: boolean, event: event, fromComponent: dxSortable | dxDraggable, fromData: any, fromIndex: number, itemData: any, itemElement: any, toComponent: dxSortable | dxDraggable, toData: any, toIndex: number }) => void), onDragEnd?: ((e: { cancel: boolean, component: GridBase, dropInsideItem: boolean, event: event, fromComponent: dxSortable | dxDraggable, fromData: any, fromIndex: number, itemData: any, itemElement: any, toComponent: dxSortable | dxDraggable, toData: any, toIndex: number }) => void), onDragMove?: ((e: { cancel: boolean, component: GridBase, dropInsideItem: boolean, event: event, fromComponent: dxSortable | dxDraggable, fromData: any, fromIndex: number, itemData: any, itemElement: any, toComponent: dxSortable | dxDraggable, toData: any, toIndex: number }) => void), onDragStart?: ((e: { cancel: boolean, component: GridBase, event: event, fromData: any, fromIndex: number, itemData: any, itemElement: any }) => void), onRemove?: ((e: { component: GridBase, event: event, fromComponent: dxSortable | dxDraggable, fromData: any, fromIndex: number, itemData: any, itemElement: any, toComponent: dxSortable | dxDraggable, toData: any, toIndex: number }) => void), onReorder?: ((e: { component: GridBase, dropInsideItem: boolean, event: event, fromComponent: dxSortable | dxDraggable, fromData: any, fromIndex: number, itemData: any, itemElement: any, promise: any, toComponent: dxSortable | dxDraggable, toData: any, toIndex: number }) => void), scrollSensitivity?: number, scrollSpeed?: number, showDragIcons?: boolean } {\n return this._getOption('rowDragging');\n }\n set rowDragging(value: { allowDropInsideItem?: boolean, allowReordering?: boolean, autoScroll?: boolean, boundary?: any | string | undefined, container?: any | string | undefined, cursorOffset?: string | { x?: number, y?: number }, data?: any | undefined, dragDirection?: DragDirection, dragTemplate?: any, dropFeedbackMode?: DragHighlight, filter?: string, group?: string | undefined, handle?: string, onAdd?: ((e: { component: GridBase, dropInsideItem: boolean, event: event, fromComponent: dxSortable | dxDraggable, fromData: any, fromIndex: number, itemData: any, itemElement: any, toComponent: dxSortable | dxDraggable, toData: any, toIndex: number }) => void), onDragChange?: ((e: { cancel: boolean, component: GridBase, dropInsideItem: boolean, event: event, fromComponent: dxSortable | dxDraggable, fromData: any, fromIndex: number, itemData: any, itemElement: any, toComponent: dxSortable | dxDraggable, toData: any, toIndex: number }) => void), onDragEnd?: ((e: { cancel: boolean, component: GridBase, dropInsideItem: boolean, event: event, fromComponent: dxSortable | dxDraggable, fromData: any, fromIndex: number, itemData: any, itemElement: any, toComponent: dxSortable | dxDraggable, toData: any, toIndex: number }) => void), onDragMove?: ((e: { cancel: boolean, component: GridBase, dropInsideItem: boolean, event: event, fromComponent: dxSortable | dxDraggable, fromData: any, fromIndex: number, itemData: any, itemElement: any, toComponent: dxSortable | dxDraggable, toData: any, toIndex: number }) => void), onDragStart?: ((e: { cancel: boolean, component: GridBase, event: event, fromData: any, fromIndex: number, itemData: any, itemElement: any }) => void), onRemove?: ((e: { component: GridBase, event: event, fromComponent: dxSortable | dxDraggable, fromData: any, fromIndex: number, itemData: any, itemElement: any, toComponent: dxSortable | dxDraggable, toData: any, toIndex: number }) => void), onReorder?: ((e: { component: GridBase, dropInsideItem: boolean, event: event, fromComponent: dxSortable | dxDraggable, fromData: any, fromIndex: number, itemData: any, itemElement: any, promise: any, toComponent: dxSortable | dxDraggable, toData: any, toIndex: number }) => void), scrollSensitivity?: number, scrollSpeed?: number, showDragIcons?: boolean }) {\n this._setOption('rowDragging', value);\n }\n\n\n /**\n * Specifies a custom template for rows.\n \n * @deprecated Use the dataRowTemplate option instead.\n \n */\n @Input()\n get rowTemplate(): any {\n return this._getOption('rowTemplate');\n }\n set rowTemplate(value: any) {\n this._setOption('rowTemplate', value);\n }\n\n\n /**\n * Switches the UI component to a right-to-left representation.\n \n */\n @Input()\n get rtlEnabled(): boolean {\n return this._getOption('rtlEnabled');\n }\n set rtlEnabled(value: boolean) {\n this._setOption('rtlEnabled', value);\n }\n\n\n /**\n * Configures scrolling.\n \n */\n @Input()\n get scrolling(): { columnRenderingMode?: DataRenderMode, mode?: DataGridScrollMode, preloadEnabled?: boolean, renderAsync?: boolean | undefined, rowRenderingMode?: DataRenderMode, scrollByContent?: boolean, scrollByThumb?: boolean, showScrollbar?: ScrollbarMode, useNative?: boolean | Mode } {\n return this._getOption('scrolling');\n }\n set scrolling(value: { columnRenderingMode?: DataRenderMode, mode?: DataGridScrollMode, preloadEnabled?: boolean, renderAsync?: boolean | undefined, rowRenderingMode?: DataRenderMode, scrollByContent?: boolean, scrollByThumb?: boolean, showScrollbar?: ScrollbarMode, useNative?: boolean | Mode }) {\n this._setOption('scrolling', value);\n }\n\n\n /**\n * Configures the search panel.\n \n */\n @Input()\n get searchPanel(): SearchPanel {\n return this._getOption('searchPanel');\n }\n set searchPanel(value: SearchPanel) {\n this._setOption('searchPanel', value);\n }\n\n\n /**\n * Allows you to select rows or determine which rows are selected.\n \n */\n @Input()\n get selectedRowKeys(): Array<any> {\n return this._getOption('selectedRowKeys');\n }\n set selectedRowKeys(value: Array<any>) {\n this._setOption('selectedRowKeys', value);\n }\n\n\n /**\n * Configures runtime selection.\n \n */\n @Input()\n get selection(): { allowSelectAll?: boolean, deferred?: bool