devextreme-angular/fesm2022/devextreme-angular-ui-data-grid.mjs.map

Angular UI and visualization components based on DevExtreme widgets

{"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: 24.2.6\n * Build date: Mon Mar 17 2025\n *\n * Copyright (c) 2012 - 2025 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-angular\n */\n\n/* tslint:disable:max-line-length */\r\n\r\n\r\nimport {\r\n    TransferState,\r\n    Component,\r\n    NgModule,\r\n    ElementRef,\r\n    NgZone,\r\n    PLATFORM_ID,\r\n    Inject,\r\n\r\n    Input,\r\n    Output,\r\n    OnDestroy,\r\n    EventEmitter,\r\n    OnChanges,\r\n    DoCheck,\r\n    SimpleChanges,\r\n    ContentChildren,\r\n    QueryList\r\n} from '@angular/core';\r\n\r\nexport { ExplicitTypes } from 'devextreme/ui/data_grid';\r\n\r\nimport DataSource from 'devextreme/data/data_source';\r\nimport dxDataGrid from 'devextreme/ui/data_grid';\r\nimport dxSortable from 'devextreme/ui/sortable';\r\nimport dxDraggable from 'devextreme/ui/draggable';\r\nimport { ColumnChooserMode, ColumnChooserSearchConfig, ColumnChooserSelectionConfig, ColumnResizeMode, DataChange, GridsEditMode, NewRowPosition, GridsEditRefreshMode, StartEditAction, GridBase, ApplyFilterMode, GroupExpandMode, HeaderFilterSearchConfig, EnterKeyAction, EnterKeyDirection, Pager, DataRenderMode, SelectionColumnDisplayMode, StateStoreType, SummaryType } from 'devextreme/common/grids';\r\nimport { PositionConfig } from 'devextreme/common/core/animation';\r\nimport { SortOrder, Mode, DragDirection, DragHighlight, ScrollbarMode, SingleMultipleOrNone, SelectAllMode, HorizontalAlignment } from 'devextreme/common';\r\nimport { dxDataGridColumn, dxDataGridRowObject, DataGridExportFormat, AdaptiveDetailRowPreparingEvent, 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';\r\nimport { DataSourceOptions } from 'devextreme/data/data_source';\r\nimport { Store } from 'devextreme/data/store';\r\nimport { dxFormOptions } from 'devextreme/ui/form';\r\nimport { dxPopupOptions } from 'devextreme/ui/popup';\r\nimport { dxFilterBuilderOptions } from 'devextreme/ui/filter_builder';\r\nimport { event } from 'devextreme/events/events.types';\r\nimport { Format } from 'devextreme/common/core/localization';\r\n\r\nimport DxDataGrid from 'devextreme/ui/data_grid';\r\n\r\n\r\nimport {\r\n    DxComponent,\r\n    DxTemplateHost,\r\n    DxIntegrationModule,\r\n    DxTemplateModule,\r\n    NestedOptionHost,\r\n    IterableDifferHelper,\r\n    WatcherHelper\r\n} from 'devextreme-angular/core';\r\n\r\nimport { DxoColumnChooserModule } from 'devextreme-angular/ui/nested';\r\nimport { DxoPositionModule } from 'devextreme-angular/ui/nested';\r\nimport { DxoAtModule } from 'devextreme-angular/ui/nested';\r\nimport { DxoBoundaryOffsetModule } from 'devextreme-angular/ui/nested';\r\nimport { DxoCollisionModule } from 'devextreme-angular/ui/nested';\r\nimport { DxoMyModule } from 'devextreme-angular/ui/nested';\r\nimport { DxoOffsetModule } from 'devextreme-angular/ui/nested';\r\nimport { DxoSearchModule } from 'devextreme-angular/ui/nested';\r\nimport { DxoSelectionModule } from 'devextreme-angular/ui/nested';\r\nimport { DxoColumnFixingModule } from 'devextreme-angular/ui/nested';\r\nimport { DxoIconsModule } from 'devextreme-angular/ui/nested';\r\nimport { DxoTextsModule } from 'devextreme-angular/ui/nested';\r\nimport { DxiColumnModule } from 'devextreme-angular/ui/nested';\r\nimport { DxiButtonModule } from 'devextreme-angular/ui/nested';\r\nimport { DxoHeaderFilterModule } from 'devextreme-angular/ui/nested';\r\nimport { DxoLookupModule } from 'devextreme-angular/ui/nested';\r\nimport { DxoFormatModule } from 'devextreme-angular/ui/nested';\r\nimport { DxoFormItemModule } from 'devextreme-angular/ui/nested';\r\nimport { DxoLabelModule } from 'devextreme-angular/ui/nested';\r\nimport { DxiValidationRuleModule } from 'devextreme-angular/ui/nested';\r\nimport { DxoEditingModule } from 'devextreme-angular/ui/nested';\r\nimport { DxiChangeModule } from 'devextreme-angular/ui/nested';\r\nimport { DxoFormModule } from 'devextreme-angular/ui/nested';\r\nimport { DxoColCountByScreenModule } from 'devextreme-angular/ui/nested';\r\nimport { DxiItemModule } from 'devextreme-angular/ui/nested';\r\nimport { DxoTabPanelOptionsModule } from 'devextreme-angular/ui/nested';\r\nimport { DxiTabModule } from 'devextreme-angular/ui/nested';\r\nimport { DxoButtonOptionsModule } from 'devextreme-angular/ui/nested';\r\nimport { DxoPopupModule } from 'devextreme-angular/ui/nested';\r\nimport { DxoAnimationModule } from 'devextreme-angular/ui/nested';\r\nimport { DxoHideModule } from 'devextreme-angular/ui/nested';\r\nimport { DxoFromModule } from 'devextreme-angular/ui/nested';\r\nimport { DxoToModule } from 'devextreme-angular/ui/nested';\r\nimport { DxoShowModule } from 'devextreme-angular/ui/nested';\r\nimport { DxoExportModule } from 'devextreme-angular/ui/nested';\r\nimport { DxoFilterBuilderModule } from 'devextreme-angular/ui/nested';\r\nimport { DxiCustomOperationModule } from 'devextreme-angular/ui/nested';\r\nimport { DxiFieldModule } from 'devextreme-angular/ui/nested';\r\nimport { DxoFilterOperationDescriptionsModule } from 'devextreme-angular/ui/nested';\r\nimport { DxoGroupOperationDescriptionsModule } from 'devextreme-angular/ui/nested';\r\nimport { DxoFilterBuilderPopupModule } from 'devextreme-angular/ui/nested';\r\nimport { DxoFilterPanelModule } from 'devextreme-angular/ui/nested';\r\nimport { DxoFilterRowModule } from 'devextreme-angular/ui/nested';\r\nimport { DxoOperationDescriptionsModule } from 'devextreme-angular/ui/nested';\r\nimport { DxoGroupingModule } from 'devextreme-angular/ui/nested';\r\nimport { DxoGroupPanelModule } from 'devextreme-angular/ui/nested';\r\nimport { DxoKeyboardNavigationModule } from 'devextreme-angular/ui/nested';\r\nimport { DxoLoadPanelModule } from 'devextreme-angular/ui/nested';\r\nimport { DxoMasterDetailModule } from 'devextreme-angular/ui/nested';\r\nimport { DxoPagerModule } from 'devextreme-angular/ui/nested';\r\nimport { DxoPagingModule } from 'devextreme-angular/ui/nested';\r\nimport { DxoRemoteOperationsModule } from 'devextreme-angular/ui/nested';\r\nimport { DxoRowDraggingModule } from 'devextreme-angular/ui/nested';\r\nimport { DxoCursorOffsetModule } from 'devextreme-angular/ui/nested';\r\nimport { DxoScrollingModule } from 'devextreme-angular/ui/nested';\r\nimport { DxoSearchPanelModule } from 'devextreme-angular/ui/nested';\r\nimport { DxiSortByGroupSummaryInfoModule } from 'devextreme-angular/ui/nested';\r\nimport { DxoSortingModule } from 'devextreme-angular/ui/nested';\r\nimport { DxoStateStoringModule } from 'devextreme-angular/ui/nested';\r\nimport { DxoSummaryModule } from 'devextreme-angular/ui/nested';\r\nimport { DxiGroupItemModule } from 'devextreme-angular/ui/nested';\r\nimport { DxoValueFormatModule } from 'devextreme-angular/ui/nested';\r\nimport { DxiTotalItemModule } from 'devextreme-angular/ui/nested';\r\nimport { DxoToolbarModule } from 'devextreme-angular/ui/nested';\r\n\r\nimport { DxoDataGridAnimationModule } from 'devextreme-angular/ui/data-grid/nested';\r\nimport { DxiDataGridAsyncRuleModule } from 'devextreme-angular/ui/data-grid/nested';\r\nimport { DxoDataGridAtModule } from 'devextreme-angular/ui/data-grid/nested';\r\nimport { DxoDataGridBoundaryOffsetModule } from 'devextreme-angular/ui/data-grid/nested';\r\nimport { DxiDataGridButtonModule } from 'devextreme-angular/ui/data-grid/nested';\r\nimport { DxiDataGridChangeModule } from 'devextreme-angular/ui/data-grid/nested';\r\nimport { DxoDataGridColCountByScreenModule } from 'devextreme-angular/ui/data-grid/nested';\r\nimport { DxoDataGridCollisionModule } from 'devextreme-angular/ui/data-grid/nested';\r\nimport { DxiDataGridColumnModule } from 'devextreme-angular/ui/data-grid/nested';\r\nimport { DxoDataGridColumnChooserModule } from 'devextreme-angular/ui/data-grid/nested';\r\nimport { DxoDataGridColumnChooserSearchModule } from 'devextreme-angular/ui/data-grid/nested';\r\nimport { DxoDataGridColumnChooserSelectionModule } from 'devextreme-angular/ui/data-grid/nested';\r\nimport { DxoDataGridColumnFixingModule } from 'devextreme-angular/ui/data-grid/nested';\r\nimport { DxoDataGridColumnFixingTextsModule } from 'devextreme-angular/ui/data-grid/nested';\r\nimport { DxoDataGridColumnHeaderFilterModule } from 'devextreme-angular/ui/data-grid/nested';\r\nimport { DxoDataGridColumnHeaderFilterSearchModule } from 'devextreme-angular/ui/data-grid/nested';\r\nimport { DxoDataGridColumnLookupModule } from 'devextreme-angular/ui/data-grid/nested';\r\nimport { DxiDataGridCompareRuleModule } from 'devextreme-angular/ui/data-grid/nested';\r\nimport { DxoDataGridCursorOffsetModule } from 'devextreme-angular/ui/data-grid/nested';\r\nimport { DxiDataGridCustomOperationModule } from 'devextreme-angular/ui/data-grid/nested';\r\nimport { DxiDataGridCustomRuleModule } from 'devextreme-angular/ui/data-grid/nested';\r\nimport { DxoDataGridDataGridHeaderFilterModule } from 'devextreme-angular/ui/data-grid/nested';\r\nimport { DxoDataGridDataGridHeaderFilterSearchModule } from 'devextreme-angular/ui/data-grid/nested';\r\nimport { DxoDataGridDataGridHeaderFilterTextsModule } from 'devextreme-angular/ui/data-grid/nested';\r\nimport { DxoDataGridDataGridSelectionModule } from 'devextreme-angular/ui/data-grid/nested';\r\nimport { DxoDataGridEditingModule } from 'devextreme-angular/ui/data-grid/nested';\r\nimport { DxoDataGridEditingTextsModule } from 'devextreme-angular/ui/data-grid/nested';\r\nimport { DxiDataGridEmailRuleModule } from 'devextreme-angular/ui/data-grid/nested';\r\nimport { DxoDataGridExportModule } from 'devextreme-angular/ui/data-grid/nested';\r\nimport { DxoDataGridExportTextsModule } from 'devextreme-angular/ui/data-grid/nested';\r\nimport { DxiDataGridFieldModule } from 'devextreme-angular/ui/data-grid/nested';\r\nimport { DxoDataGridFieldLookupModule } from 'devextreme-angular/ui/data-grid/nested';\r\nimport { DxoDataGridFilterBuilderModule } from 'devextreme-angular/ui/data-grid/nested';\r\nimport { DxoDataGridFilterBuilderPopupModule } from 'devextreme-angular/ui/data-grid/nested';\r\nimport { DxoDataGridFilterOperationDescriptionsModule } from 'devextreme-angular/ui/data-grid/nested';\r\nimport { DxoDataGridFilterPanelModule } from 'devextreme-angular/ui/data-grid/nested';\r\nimport { DxoDataGridFilterPanelTextsModule } from 'devextreme-angular/ui/data-grid/nested';\r\nimport { DxoDataGridFilterRowModule } from 'devextreme-angular/ui/data-grid/nested';\r\nimport { DxoDataGridFormModule } from 'devextreme-angular/ui/data-grid/nested';\r\nimport { DxoDataGridFormatModule } from 'devextreme-angular/ui/data-grid/nested';\r\nimport { DxoDataGridFormItemModule } from 'devextreme-angular/ui/data-grid/nested';\r\nimport { DxoDataGridFromModule } from 'devextreme-angular/ui/data-grid/nested';\r\nimport { DxoDataGridGroupingModule } from 'devextreme-angular/ui/data-grid/nested';\r\nimport { DxoDataGridGroupingTextsModule } from 'devextreme-angular/ui/data-grid/nested';\r\nimport { DxiDataGridGroupItemModule } from 'devextreme-angular/ui/data-grid/nested';\r\nimport { DxoDataGridGroupOperationDescriptionsModule } from 'devextreme-angular/ui/data-grid/nested';\r\nimport { DxoDataGridGroupPanelModule } from 'devextreme-angular/ui/data-grid/nested';\r\nimport { DxoDataGridHeaderFilterModule } from 'devextreme-angular/ui/data-grid/nested';\r\nimport { DxoDataGridHideModule } from 'devextreme-angular/ui/data-grid/nested';\r\nimport { DxoDataGridIconsModule } from 'devextreme-angular/ui/data-grid/nested';\r\nimport { DxiDataGridItemModule } from 'devextreme-angular/ui/data-grid/nested';\r\nimport { DxoDataGridKeyboardNavigationModule } from 'devextreme-angular/ui/data-grid/nested';\r\nimport { DxoDataGridLabelModule } from 'devextreme-angular/ui/data-grid/nested';\r\nimport { DxoDataGridLoadPanelModule } from 'devextreme-angular/ui/data-grid/nested';\r\nimport { DxoDataGridLookupModule } from 'devextreme-angular/ui/data-grid/nested';\r\nimport { DxoDataGridMasterDetailModule } from 'devextreme-angular/ui/data-grid/nested';\r\nimport { DxoDataGridMyModule } from 'devextreme-angular/ui/data-grid/nested';\r\nimport { DxiDataGridNumericRuleModule } from 'devextreme-angular/ui/data-grid/nested';\r\nimport { DxoDataGridOffsetModule } from 'devextreme-angular/ui/data-grid/nested';\r\nimport { DxoDataGridOperationDescriptionsModule } from 'devextreme-angular/ui/data-grid/nested';\r\nimport { DxoDataGridPagerModule } from 'devextreme-angular/ui/data-grid/nested';\r\nimport { DxoDataGridPagingModule } from 'devextreme-angular/ui/data-grid/nested';\r\nimport { DxiDataGridPatternRuleModule } from 'devextreme-angular/ui/data-grid/nested';\r\nimport { DxoDataGridPopupModule } from 'devextreme-angular/ui/data-grid/nested';\r\nimport { DxoDataGridPositionModule } from 'devextreme-angular/ui/data-grid/nested';\r\nimport { DxiDataGridRangeRuleModule } from 'devextreme-angular/ui/data-grid/nested';\r\nimport { DxoDataGridRemoteOperationsModule } from 'devextreme-angular/ui/data-grid/nested';\r\nimport { DxiDataGridRequiredRuleModule } from 'devextreme-angular/ui/data-grid/nested';\r\nimport { DxoDataGridRowDraggingModule } from 'devextreme-angular/ui/data-grid/nested';\r\nimport { DxoDataGridScrollingModule } from 'devextreme-angular/ui/data-grid/nested';\r\nimport { DxoDataGridSearchModule } from 'devextreme-angular/ui/data-grid/nested';\r\nimport { DxoDataGridSearchPanelModule } from 'devextreme-angular/ui/data-grid/nested';\r\nimport { DxoDataGridSelectionModule } from 'devextreme-angular/ui/data-grid/nested';\r\nimport { DxoDataGridShowModule } from 'devextreme-angular/ui/data-grid/nested';\r\nimport { DxiDataGridSortByGroupSummaryInfoModule } from 'devextreme-angular/ui/data-grid/nested';\r\nimport { DxoDataGridSortingModule } from 'devextreme-angular/ui/data-grid/nested';\r\nimport { DxoDataGridStateStoringModule } from 'devextreme-angular/ui/data-grid/nested';\r\nimport { DxiDataGridStringLengthRuleModule } from 'devextreme-angular/ui/data-grid/nested';\r\nimport { DxoDataGridSummaryModule } from 'devextreme-angular/ui/data-grid/nested';\r\nimport { DxoDataGridSummaryTextsModule } from 'devextreme-angular/ui/data-grid/nested';\r\nimport { DxoDataGridTextsModule } from 'devextreme-angular/ui/data-grid/nested';\r\nimport { DxoDataGridToModule } from 'devextreme-angular/ui/data-grid/nested';\r\nimport { DxoDataGridToolbarModule } from 'devextreme-angular/ui/data-grid/nested';\r\nimport { DxiDataGridToolbarItemModule } from 'devextreme-angular/ui/data-grid/nested';\r\nimport { DxiDataGridTotalItemModule } from 'devextreme-angular/ui/data-grid/nested';\r\nimport { DxiDataGridValidationRuleModule } from 'devextreme-angular/ui/data-grid/nested';\r\nimport { DxoDataGridValueFormatModule } from 'devextreme-angular/ui/data-grid/nested';\r\n\r\nimport { DxiColumnComponent } from 'devextreme-angular/ui/nested';\r\nimport { DxiSortByGroupSummaryInfoComponent } from 'devextreme-angular/ui/nested';\r\n\r\nimport { DxiDataGridColumnComponent } from 'devextreme-angular/ui/data-grid/nested';\r\nimport { DxiDataGridSortByGroupSummaryInfoComponent } from 'devextreme-angular/ui/data-grid/nested';\r\n\r\n\r\n/**\r\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.\r\n\r\n */\r\n@Component({\r\n    selector: 'dx-data-grid',\r\n    template: '',\r\n    host: { ngSkipHydration: 'true' },\r\n    providers: [\r\n        DxTemplateHost,\r\n        WatcherHelper,\r\n        NestedOptionHost,\r\n        IterableDifferHelper\r\n    ]\r\n})\r\nexport class DxDataGridComponent<TRowData = any, TKey = any> extends DxComponent implements OnDestroy, OnChanges, DoCheck {\r\n    instance: DxDataGrid<TRowData, TKey> = null;\r\n\r\n    /**\r\n     * Specifies the shortcut key that sets focus on the UI component.\r\n    \r\n     */\r\n    @Input()\r\n    get accessKey(): string | undefined {\r\n        return this._getOption('accessKey');\r\n    }\r\n    set accessKey(value: string | undefined) {\r\n        this._setOption('accessKey', value);\r\n    }\r\n\r\n\r\n    /**\r\n     * Specifies whether the UI component changes its visual state as a result of user interaction.\r\n    \r\n     */\r\n    @Input()\r\n    get activeStateEnabled(): boolean {\r\n        return this._getOption('activeStateEnabled');\r\n    }\r\n    set activeStateEnabled(value: boolean) {\r\n        this._setOption('activeStateEnabled', value);\r\n    }\r\n\r\n\r\n    /**\r\n     * Specifies whether a user can reorder columns.\r\n    \r\n     */\r\n    @Input()\r\n    get allowColumnReordering(): boolean {\r\n        return this._getOption('allowColumnReordering');\r\n    }\r\n    set allowColumnReordering(value: boolean) {\r\n        this._setOption('allowColumnReordering', value);\r\n    }\r\n\r\n\r\n    /**\r\n     * Specifies whether a user can resize columns.\r\n    \r\n     */\r\n    @Input()\r\n    get allowColumnResizing(): boolean {\r\n        return this._getOption('allowColumnResizing');\r\n    }\r\n    set allowColumnResizing(value: boolean) {\r\n        this._setOption('allowColumnResizing', value);\r\n    }\r\n\r\n\r\n    /**\r\n     * Automatically scrolls the component to the focused row when the focusedRowKey is changed.\r\n    \r\n     */\r\n    @Input()\r\n    get autoNavigateToFocusedRow(): boolean {\r\n        return this._getOption('autoNavigateToFocusedRow');\r\n    }\r\n    set autoNavigateToFocusedRow(value: boolean) {\r\n        this._setOption('autoNavigateToFocusedRow', value);\r\n    }\r\n\r\n\r\n    /**\r\n     * Specifies whether data should be cached.\r\n    \r\n     */\r\n    @Input()\r\n    get cacheEnabled(): boolean {\r\n        return this._getOption('cacheEnabled');\r\n    }\r\n    set cacheEnabled(value: boolean) {\r\n        this._setOption('cacheEnabled', value);\r\n    }\r\n\r\n\r\n    /**\r\n     * Enables a hint that appears when a user hovers the mouse pointer over a cell with truncated content.\r\n    \r\n     */\r\n    @Input()\r\n    get cellHintEnabled(): boolean {\r\n        return this._getOption('cellHintEnabled');\r\n    }\r\n    set cellHintEnabled(value: boolean) {\r\n        this._setOption('cellHintEnabled', value);\r\n    }\r\n\r\n\r\n    /**\r\n     * Specifies whether columns should adjust their widths to the content.\r\n    \r\n     */\r\n    @Input()\r\n    get columnAutoWidth(): boolean {\r\n        return this._getOption('columnAutoWidth');\r\n    }\r\n    set columnAutoWidth(value: boolean) {\r\n        this._setOption('columnAutoWidth', value);\r\n    }\r\n\r\n\r\n    /**\r\n     * Configures the column chooser.\r\n    \r\n     */\r\n    @Input()\r\n    get columnChooser(): { allowSearch?: boolean, container?: any | string | undefined, emptyPanelText?: string, enabled?: boolean, height?: number | string, mode?: ColumnChooserMode, position?: PositionConfig | undefined, search?: ColumnChooserSearchConfig, searchTimeout?: number, selection?: ColumnChooserSelectionConfig, sortOrder?: SortOrder | undefined, title?: string, width?: number | string } {\r\n        return this._getOption('columnChooser');\r\n    }\r\n    set columnChooser(value: { allowSearch?: boolean, container?: any | string | undefined, emptyPanelText?: string, enabled?: boolean, height?: number | string, mode?: ColumnChooserMode, position?: PositionConfig | undefined, search?: ColumnChooserSearchConfig, searchTimeout?: number, selection?: ColumnChooserSelectionConfig, sortOrder?: SortOrder | undefined, title?: string, width?: number | string }) {\r\n        this._setOption('columnChooser', value);\r\n    }\r\n\r\n\r\n    /**\r\n     * Configures column fixing.\r\n    \r\n     */\r\n    @Input()\r\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 } } {\r\n        return this._getOption('columnFixing');\r\n    }\r\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 } }) {\r\n        this._setOption('columnFixing', value);\r\n    }\r\n\r\n\r\n    /**\r\n     * Specifies whether the UI component should hide columns to adapt to the screen or container size. Ignored if allowColumnResizing is true and columnResizingMode is &apos;widget&apos;.\r\n    \r\n     */\r\n    @Input()\r\n    get columnHidingEnabled(): boolean {\r\n        return this._getOption('columnHidingEnabled');\r\n    }\r\n    set columnHidingEnabled(value: boolean) {\r\n        this._setOption('columnHidingEnabled', value);\r\n    }\r\n\r\n\r\n    /**\r\n     * Specifies the minimum width of columns.\r\n    \r\n     */\r\n    @Input()\r\n    get columnMinWidth(): number | undefined {\r\n        return this._getOption('columnMinWidth');\r\n    }\r\n    set columnMinWidth(value: number | undefined) {\r\n        this._setOption('columnMinWidth', value);\r\n    }\r\n\r\n\r\n    /**\r\n     * Specifies how the UI component resizes columns. Applies only if allowColumnResizing is true.\r\n    \r\n     */\r\n    @Input()\r\n    get columnResizingMode(): ColumnResizeMode {\r\n        return this._getOption('columnResizingMode');\r\n    }\r\n    set columnResizingMode(value: ColumnResizeMode) {\r\n        this._setOption('columnResizingMode', value);\r\n    }\r\n\r\n\r\n    /**\r\n     * An array of grid columns.\r\n    \r\n     */\r\n    @Input()\r\n    get columns(): Array<dxDataGridColumn | string> {\r\n        return this._getOption('columns');\r\n    }\r\n    set columns(value: Array<dxDataGridColumn | string>) {\r\n        this._setOption('columns', value);\r\n    }\r\n\r\n\r\n    /**\r\n     * Specifies the width for all data columns. Has a lower priority than the column.width property.\r\n    \r\n     */\r\n    @Input()\r\n    get columnWidth(): Mode | number | undefined {\r\n        return this._getOption('columnWidth');\r\n    }\r\n    set columnWidth(value: Mode | number | undefined) {\r\n        this._setOption('columnWidth', value);\r\n    }\r\n\r\n\r\n    /**\r\n     * Customizes columns after they are created.\r\n    \r\n     */\r\n    @Input()\r\n    get customizeColumns(): ((columns: Array<dxDataGridColumn>) => void) {\r\n        return this._getOption('customizeColumns');\r\n    }\r\n    set customizeColumns(value: ((columns: Array<dxDataGridColumn>) => void)) {\r\n        this._setOption('customizeColumns', value);\r\n    }\r\n\r\n\r\n    /**\r\n     * Specifies a custom template for data rows.\r\n    \r\n     */\r\n    @Input()\r\n    get dataRowTemplate(): any {\r\n        return this._getOption('dataRowTemplate');\r\n    }\r\n    set dataRowTemplate(value: any) {\r\n        this._setOption('dataRowTemplate', value);\r\n    }\r\n\r\n\r\n    /**\r\n     * Binds the UI component to data.\r\n    \r\n     */\r\n    @Input()\r\n    get dataSource(): Array<any> | DataSource | DataSourceOptions | null | Store | string {\r\n        return this._getOption('dataSource');\r\n    }\r\n    set dataSource(value: Array<any> | DataSource | DataSourceOptions | null | Store | string) {\r\n        this._setOption('dataSource', value);\r\n    }\r\n\r\n\r\n    /**\r\n     * Specifies the format in which date-time values should be sent to the server.\r\n    \r\n     */\r\n    @Input()\r\n    get dateSerializationFormat(): string {\r\n        return this._getOption('dateSerializationFormat');\r\n    }\r\n    set dateSerializationFormat(value: string) {\r\n        this._setOption('dateSerializationFormat', value);\r\n    }\r\n\r\n\r\n    /**\r\n     * Specifies whether the UI component responds to user interaction.\r\n    \r\n     */\r\n    @Input()\r\n    get disabled(): boolean {\r\n        return this._getOption('disabled');\r\n    }\r\n    set disabled(value: boolean) {\r\n        this._setOption('disabled', value);\r\n    }\r\n\r\n\r\n    /**\r\n     * Configures editing.\r\n    \r\n     */\r\n    @Input()\r\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 } {\r\n        return this._getOption('editing');\r\n    }\r\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 }) {\r\n        this._setOption('editing', value);\r\n    }\r\n\r\n\r\n    /**\r\n     * Specifies the global attributes to be attached to the UI component&apos;s container element.\r\n    \r\n     */\r\n    @Input()\r\n    get elementAttr(): Record<string, any> {\r\n        return this._getOption('elementAttr');\r\n    }\r\n    set elementAttr(value: Record<string, any>) {\r\n        this._setOption('elementAttr', value);\r\n    }\r\n\r\n\r\n    /**\r\n     * Indicates whether to show the error row.\r\n    \r\n     */\r\n    @Input()\r\n    get errorRowEnabled(): boolean {\r\n        return this._getOption('errorRowEnabled');\r\n    }\r\n    set errorRowEnabled(value: boolean) {\r\n        this._setOption('errorRowEnabled', value);\r\n    }\r\n\r\n\r\n    /**\r\n     * Configures client-side exporting.\r\n    \r\n     */\r\n    @Input()\r\n    get export(): { allowExportSelectedData?: boolean, enabled?: boolean, formats?: Array<DataGridExportFormat | string>, texts?: { exportAll?: string, exportSelectedRows?: string, exportTo?: string } } {\r\n        return this._getOption('export');\r\n    }\r\n    set export(value: { allowExportSelectedData?: boolean, enabled?: boolean, formats?: Array<DataGridExportFormat | string>, texts?: { exportAll?: string, exportSelectedRows?: string, exportTo?: string } }) {\r\n        this._setOption('export', value);\r\n    }\r\n\r\n\r\n    /**\r\n     * Configures the integrated filter builder.\r\n    \r\n     */\r\n    @Input()\r\n    get filterBuilder(): dxFilterBuilderOptions {\r\n        return this._getOption('filterBuilder');\r\n    }\r\n    set filterBuilder(value: dxFilterBuilderOptions) {\r\n        this._setOption('filterBuilder', value);\r\n    }\r\n\r\n\r\n    /**\r\n     * Configures the popup in which the integrated filter builder is shown.\r\n    \r\n     */\r\n    @Input()\r\n    get filterBuilderPopup(): dxPopupOptions<any> {\r\n        return this._getOption('filterBuilderPopup');\r\n    }\r\n    set filterBuilderPopup(value: dxPopupOptions<any>) {\r\n        this._setOption('filterBuilderPopup', value);\r\n    }\r\n\r\n\r\n    /**\r\n     * Configures the filter panel.\r\n    \r\n     */\r\n    @Input()\r\n    get filterPanel(): { customizeText?: ((e: { component: GridBase, filterValue: Record<string, any>, text: string }) => string), filterEnabled?: boolean, texts?: { clearFilter?: string, createFilter?: string, filterEnabledHint?: string }, visible?: boolean } {\r\n        return this._getOption('filterPanel');\r\n    }\r\n    set filterPanel(value: { customizeText?: ((e: { component: GridBase, filterValue: Record<string, any>, text: string }) => string), filterEnabled?: boolean, texts?: { clearFilter?: string, createFilter?: string, filterEnabledHint?: string }, visible?: boolean }) {\r\n        this._setOption('filterPanel', value);\r\n    }\r\n\r\n\r\n    /**\r\n     * Configures the filter row.\r\n    \r\n     */\r\n    @Input()\r\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 } {\r\n        return this._getOption('filterRow');\r\n    }\r\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 }) {\r\n        this._setOption('filterRow', value);\r\n    }\r\n\r\n\r\n    /**\r\n     * Specifies whether to synchronize the filter row, header filter, and filter builder. The synchronized filter expression is stored in the filterValue property.\r\n    \r\n     */\r\n    @Input()\r\n    get filterSyncEnabled(): boolean | Mode {\r\n        return this._getOption('filterSyncEnabled');\r\n    }\r\n    set filterSyncEnabled(value: boolean | Mode) {\r\n        this._setOption('filterSyncEnabled', value);\r\n    }\r\n\r\n\r\n    /**\r\n     * Specifies a filter expression.\r\n    \r\n     */\r\n    @Input()\r\n    get filterValue(): Array<any> | Function | string {\r\n        return this._getOption('filterValue');\r\n    }\r\n    set filterValue(value: Array<any> | Function | string) {\r\n        this._setOption('filterValue', value);\r\n    }\r\n\r\n\r\n    /**\r\n     * The index of the column that contains the focused data cell. This index is taken from the columns array.\r\n    \r\n     */\r\n    @Input()\r\n    get focusedColumnIndex(): number {\r\n        return this._getOption('focusedColumnIndex');\r\n    }\r\n    set focusedColumnIndex(value: number) {\r\n        this._setOption('focusedColumnIndex', value);\r\n    }\r\n\r\n\r\n    /**\r\n     * Specifies whether the focused row feature is enabled.\r\n    \r\n     */\r\n    @Input()\r\n    get focusedRowEnabled(): boolean {\r\n        return this._getOption('focusedRowEnabled');\r\n    }\r\n    set focusedRowEnabled(value: boolean) {\r\n        this._setOption('focusedRowEnabled', value);\r\n    }\r\n\r\n\r\n    /**\r\n     * Specifies or indicates the focused data row&apos;s index.\r\n    \r\n     */\r\n    @Input()\r\n    get focusedRowIndex(): number {\r\n        return this._getOption('focusedRowIndex');\r\n    }\r\n    set focusedRowIndex(value: number) {\r\n        this._setOption('focusedRowIndex', value);\r\n    }\r\n\r\n\r\n    /**\r\n     * Specifies initially or currently focused grid row&apos;s key.\r\n    \r\n     */\r\n    @Input()\r\n    get focusedRowKey(): any | undefined {\r\n        return this._getOption('focusedRowKey');\r\n    }\r\n    set focusedRowKey(value: any | undefined) {\r\n        this._setOption('focusedRowKey', value);\r\n    }\r\n\r\n\r\n    /**\r\n     * Configures grouping.\r\n    \r\n     */\r\n    @Input()\r\n    get grouping(): { allowCollapsing?: boolean, autoExpandAll?: boolean, contextMenuEnabled?: boolean, expandMode?: GroupExpandMode, texts?: { groupByThisColumn?: string, groupContinuedMessage?: string, groupContinuesMessage?: string, ungroup?: string, ungroupAll?: string } } {\r\n        return this._getOption('grouping');\r\n    }\r\n    set grouping(value: { allowCollapsing?: boolean, autoExpandAll?: boolean, contextMenuEnabled?: boolean, expandMode?: GroupExpandMode, texts?: { groupByThisColumn?: string, groupContinuedMessage?: string, groupContinuesMessage?: string, ungroup?: string, ungroupAll?: string } }) {\r\n        this._setOption('grouping', value);\r\n    }\r\n\r\n\r\n    /**\r\n     * Configures the group panel.\r\n    \r\n     */\r\n    @Input()\r\n    get groupPanel(): { allowColumnDragging?: boolean, emptyPanelText?: string, visible?: boolean | Mode } {\r\n        return this._getOption('groupPanel');\r\n    }\r\n    set groupPanel(value: { allowColumnDragging?: boolean, emptyPanelText?: string, visible?: boolean | Mode }) {\r\n        this._setOption('groupPanel', value);\r\n    }\r\n\r\n\r\n    /**\r\n     * Configures the header filter feature.\r\n    \r\n     */\r\n    @Input()\r\n    get headerFilter(): { allowSearch?: boolean, allowSelectAll?: boolean, height?: number | string, search?: HeaderFilterSearchConfig, searchTimeout?: number, texts?: { cancel?: string, emptyValue?: string, ok?: string }, visible?: boolean, width?: number | string } {\r\n        return this._getOption('headerFilter');\r\n    }\r\n    set headerFilter(value: { allowSearch?: boolean, allowSelectAll?: boolean, height?: number | string, search?: HeaderFilterSearchConfig, searchTimeout?: number, texts?: { cancel?: string, emptyValue?: string, ok?: string }, visible?: boolean, width?: number | string }) {\r\n        this._setOption('headerFilter', value);\r\n    }\r\n\r\n\r\n    /**\r\n     * Specifies the UI component&apos;s height.\r\n    \r\n     */\r\n    @Input()\r\n    get height(): (() => number | string) | number | string | undefined {\r\n        return this._getOption('height');\r\n    }\r\n    set height(value: (() => number | string) | number | string | undefined) {\r\n        this._setOption('height', value);\r\n    }\r\n\r\n\r\n    /**\r\n     * Specifies whether to highlight rows and cells with edited data. repaintChangesOnly should be true.\r\n    \r\n     */\r\n    @Input()\r\n    get highlightChanges(): boolean {\r\n        return this._getOption('highlightChanges');\r\n    }\r\n    set highlightChanges(value: boolean) {\r\n        this._setOption('highlightChanges', value);\r\n    }\r\n\r\n\r\n    /**\r\n     * Specifies text for a hint that appears when a user pauses on the UI component.\r\n    \r\n     */\r\n    @Input()\r\n    get hint(): string | undefined {\r\n        return this._getOption('hint');\r\n    }\r\n    set hint(value: string | undefined) {\r\n        this._setOption('hint', value);\r\n    }\r\n\r\n\r\n    /**\r\n     * Specifies whether the UI component changes its state when a user pauses on it.\r\n    \r\n     */\r\n    @Input()\r\n    get hoverStateEnabled(): boolean {\r\n        return this._getOption('hoverStateEnabled');\r\n    }\r\n    set hoverStateEnabled(value: boolean) {\r\n        this._setOption('hoverStateEnabled', value);\r\n    }\r\n\r\n\r\n    /**\r\n     * Configures keyboard navigation.\r\n    \r\n     */\r\n    @Input()\r\n    get keyboardNavigation(): { editOnKeyPress?: boolean, enabled?: boolean, enterKeyAction?: EnterKeyAction, enterKeyDirection?: EnterKeyDirection } {\r\n        return this._getOption('keyboardNavigation');\r\n    }\r\n    set keyboardNavigation(value: { editOnKeyPress?: boolean, enabled?: boolean, enterKeyAction?: EnterKeyAction, enterKeyDirection?: EnterKeyDirection }) {\r\n        this._setOption('keyboardNavigation', value);\r\n    }\r\n\r\n\r\n    /**\r\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.\r\n    \r\n     */\r\n    @Input()\r\n    get keyExpr(): Array<string> | string | undefined {\r\n        return this._getOption('keyExpr');\r\n    }\r\n    set keyExpr(value: Array<string> | string | undefined) {\r\n        this._setOption('keyExpr', value);\r\n    }\r\n\r\n\r\n    /**\r\n     * Configures the load panel.\r\n    \r\n     */\r\n    @Input()\r\n    get loadPanel(): { enabled?: boolean | Mode, height?: number | string, indicatorSrc?: string, shading?: boolean, shadingColor?: string, showIndicator?: boolean, showPane?: boolean, text?: string, width?: number | string } {\r\n        return this._getOption('loadPanel');\r\n    }\r\n    set loadPanel(value: { enabled?: boolean | Mode, height?: number | string, indicatorSrc?: string, shading?: boolean, shadingColor?: string, showIndicator?: boolean, showPane?: boolean, text?: string, width?: number | string }) {\r\n        this._setOption('loadPanel', value);\r\n    }\r\n\r\n\r\n    /**\r\n     * Allows you to build a master-detail interface in the grid.\r\n    \r\n     */\r\n    @Input()\r\n    get masterDetail(): { autoExpandAll?: boolean, enabled?: boolean, template?: any } {\r\n        return this._getOption('masterDetail');\r\n    }\r\n    set masterDetail(value: { autoExpandAll?: boolean, enabled?: boolean, template?: any }) {\r\n        this._setOption('masterDetail', value);\r\n    }\r\n\r\n\r\n    /**\r\n     * Specifies a text string shown when the widget does not display any data.\r\n    \r\n     */\r\n    @Input()\r\n    get noDataText(): string {\r\n        return this._getOption('noDataText');\r\n    }\r\n    set noDataText(value: string) {\r\n        this._setOption('noDataText', value);\r\n    }\r\n\r\n\r\n    /**\r\n     * Configures the pager.\r\n    \r\n     */\r\n    @Input()\r\n    get pager(): Pager {\r\n        return this._getOption('pager');\r\n    }\r\n    set pager(value: Pager) {\r\n        this._setOption('pager', value);\r\n    }\r\n\r\n\r\n    /**\r\n     * Configures paging.\r\n    \r\n     */\r\n    @Input()\r\n    get paging(): { enabled?: boolean, pageIndex?: number, pageSize?: number } {\r\n        return this._getOption('paging');\r\n    }\r\n    set paging(value: { enabled?: boolean, pageIndex?: number, pageSize?: number }) {\r\n        this._setOption('paging', value);\r\n    }\r\n\r\n\r\n    /**\r\n     * Notifies the DataGrid of the server&apos;s data processing operations.\r\n    \r\n     */\r\n    @Input()\r\n    get remoteOperations(): boolean | Mode | { filtering?: boolean, grouping?: boolean, groupPaging?: boolean, paging?: boolean, sorting?: boolean, summary?: boolean } {\r\n        return this._getOption('remoteOperations');\r\n    }\r\n    set remoteOperations(value: boolean | Mode | { filtering?: boolean, grouping?: boolean, groupPaging?: boolean, paging?: boolean, sorting?: boolean, summary?: boolean }) {\r\n        this._setOption('remoteOperations', value);\r\n    }\r\n\r\n\r\n    /**\r\n     * Specifies whether to render the filter row, command columns, and columns with showEditorAlways set to true after other elements.\r\n    \r\n     */\r\n    @Input()\r\n    get renderAsync(): boolean {\r\n        return this._getOption('renderAsync');\r\n    }\r\n    set renderAsync(value: boolean) {\r\n        this._setOption('renderAsync', value);\r\n    }\r\n\r\n\r\n    /**\r\n     * Specifies whether to repaint only those cells whose data changed.\r\n    \r\n     */\r\n    @Input()\r\n    get repaintChangesOnly(): boolean {\r\n        return this._getOption('repaintChangesOnly');\r\n    }\r\n    set repaintChangesOnly(value: boolean) {\r\n        this._setOption('repaintChangesOnly', value);\r\n    }\r\n\r\n\r\n    /**\r\n     * Specifies whether rows should be shaded differently.\r\n    \r\n     */\r\n    @Input()\r\n    get rowAlternationEnabled(): boolean {\r\n        return this._getOption('rowAlternationEnabled');\r\n    }\r\n    set rowAlternationEnabled(value: boolean) {\r\n        this._setOption('rowAlternationEnabled', value);\r\n    }\r\n\r\n\r\n    /**\r\n     * Configures row reordering using drag and drop gestures.\r\n    \r\n     */\r\n    @Input()\r\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 } {\r\n        return this._getOption('rowDragging');\r\n    }\r\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 }) {\r\n        this._setOption('rowDragging', value);\r\n    }\r\n\r\n\r\n    /**\r\n     * Specifies a custom template for rows.\r\n    \r\n     * @deprecated Use the dataRowTemplate option instead.\r\n    \r\n     */\r\n    @Input()\r\n    get rowTemplate(): any {\r\n        return this._getOption('rowTemplate');\r\n    }\r\n    set rowTemplate(value: any) {\r\n        this._setOption('rowTemplate', value);\r\n    }\r\n\r\n\r\n    /**\r\n     * Switches the UI component to a right-to-left representation.\r\n    \r\n     */\r\n    @Input()\r\n    get rtlEnabled(): boolean {\r\n        return this._getOption('rtlEnabled');\r\n    }\r\n    set rtlEnabled(value: boolean) {\r\n        this._setOption('rtlEnabled', value);\r\n    }\r\n\r\n\r\n    /**\r\n     * Configures scrolling.\r\n    \r\n     */\r\n    @Input()\r\n    get scrolling(): { columnRenderingMode?: DataRenderMode, mode?: DataGridScrollMode, preloadEnabled?: boolean, renderAsync?: boolean | undefined, rowRenderingMode?: DataRenderMode, scrollByContent?: boolean, scrollByThumb?: boolean, showScrollbar?: ScrollbarMode, useNative?: boolean | Mode } {\r\n        return this._getOption('scrolling');\r\n    }\r\n    set scrolling(value: { columnRenderingMode?: DataRenderMode, mode?: DataGridScrollMode, preloadEnabled?: boolean, renderAsync?: boolean | undefined, rowRenderingMode?: DataRenderMode, scrollByContent?: boolean, scrollByThumb?: boolean, showScrollbar?: ScrollbarMode, useNative?: boolean | Mode }) {\r\n        this._setOption('scrolling', value);\r\n    }\r\n\r\n\r\n    /**\r\n     * Configures the search panel.\r\n    \r\n     */\r\n    @Input()\r\n    get searchPanel(): { highlightCaseSensitive?: boolean, highlightSearchText?: boolean, placeholder?: string, searchVisibleColumnsOnly?: boolean, text?: string, visible?: boolean, width?: number | string } {\r\n        return this._getOption('searchPanel');\r\n    }\r\n    set searchPanel(value: { highlightCaseSensitive?: boolean, highlightSearchText?: boolean, placeholder?: string, searchVisibleColumnsOnly?: boolean, text?: string, visible?: boolean, width?: number | string }) {\r\n        this._setOption('searchPanel', value);\r\n    }\r\n\r\n\r\n    /**\r\n     * Allows you to select rows or determine which rows are selected.\r\n    \r\n     */\r\n    @Input()\r\n    get selectedRowKeys(): Array<any> {\r\n        return this._getOption('selectedRowKeys');\r\n    }\r\n    set selectedRowKeys(value: Array<any>) {\r\n        this._setOption('selectedRowKeys', value);\r\n    }\r\n\r\n\r\n    /**\r\n     * Configures runtime selection.\r\n    \r\n     */\r\n    @Input()\r\n    get selection(): { allowSelectAll?: boolean, deferred?: boolean, mode?: SingleMultipleOrNone, selectAllMode?: SelectAllMode, sensitivity?: SelectionSensitivity, showCheckBoxesMode?: SelectionColumnDisplayMode } {\r\n        return this._getOption('selection');\r\n    }\r\n    set selection(value: { allowSelectAll?: boolean, deferred?: boolean, mode?: SingleMultipleOrNone, selectAllMode?: SelectAllMode, sensitivity?: SelectionSensitivity, showCheckBoxesMode?: SelectionColumnDisplayMode }) {\r\n        this._setOption('selection', value);\r\n    }\r\n\r\n\r\n    /**\r\n     * Specifies filters for the rows that must be selected initially. Applies only if selection.deferred is true.\r\n    \r\n     */\r\n    @Input()\r\n    get selectionFilter(): Array<any> | Function | string {\r\n        return this._getOption('selectionFilter');\r\n    }\r\n    set selectionFilter(value: Array<an