devextreme-angular/fesm2022/devextreme-angular-ui-tree-list.mjs.map

DevExtreme UI and Visualization Components for Angular

{"version":3,"file":"devextreme-angular-ui-tree-list.mjs","sources":["../../../dist/ui/tree-list/index.ts","../../../dist/ui/tree-list/devextreme-angular-ui-tree-list.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/tree_list';\n\nimport type dxSortable from 'devextreme/ui/sortable';\nimport type dxDraggable from 'devextreme/ui/draggable';\nimport type { AIAssistant, ColumnChooser, ColumnResizeMode, DataChange, GridsEditMode, GridsEditRefreshMode, StartEditAction, FilterPanel, ApplyFilterMode, HeaderFilter, EnterKeyAction, EnterKeyDirection, Pager, GridBase, DataRenderMode, SearchPanel, Sorting, StateStoreType } from 'devextreme/common/grids';\nimport type { AIIntegration } from 'devextreme/common/ai-integration';\nimport type { default as dxTreeList, dxTreeListColumn, dxTreeListRowObject, TreeListFilterMode, AdaptiveDetailRowPreparingEvent, AIAssistantRequestCreatingEvent, AIColumnRequestCreatingEvent, CellClickEvent, CellDblClickEvent, CellHoverChangedEvent, CellPreparedEvent, ContentReadyEvent, ContextMenuPreparingEvent, DataErrorOccurredEvent, DisposingEvent, EditCanceledEvent, EditCancelingEvent, EditingStartEvent, EditorPreparedEvent, EditorPreparingEvent, FocusedCellChangedEvent, FocusedCellChangingEvent, FocusedRowChangedEvent, FocusedRowChangingEvent, InitializedEvent, InitNewRowEvent, KeyDownEvent, NodesInitializedEvent, OptionChangedEvent, RowClickEvent, RowCollapsedEvent, RowCollapsingEvent, RowDblClickEvent, RowExpandedEvent, RowExpandingEvent, RowInsertedEvent, RowInsertingEvent, RowPreparedEvent, RowRemovedEvent, RowRemovingEvent, RowUpdatedEvent, RowUpdatingEvent, RowValidatingEvent, SavedEvent, SavingEvent, SelectionChangedEvent, ToolbarPreparingEvent, dxTreeListToolbar } from 'devextreme/ui/tree_list';\nimport type { Mode, DataStructure, DragDirection, DragHighlight, ScrollMode, ScrollbarMode, SingleMultipleOrNone } 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';\n\nimport DxTreeList from 'devextreme/ui/tree_list';\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 { 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 { DxoKeyboardNavigationModule } from 'devextreme-angular/ui/nested';\nimport { DxoLoadPanelModule } 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 { DxoSortingModule } from 'devextreme-angular/ui/nested';\nimport { DxoStateStoringModule } from 'devextreme-angular/ui/nested';\nimport { DxoToolbarModule } from 'devextreme-angular/ui/nested';\n\nimport { DxoTreeListAIModule } from 'devextreme-angular/ui/tree-list/nested';\nimport { DxoTreeListAIAssistantModule } from 'devextreme-angular/ui/tree-list/nested';\nimport { DxoTreeListAIOptionsModule } from 'devextreme-angular/ui/tree-list/nested';\nimport { DxoTreeListAnimationModule } from 'devextreme-angular/ui/tree-list/nested';\nimport { DxiTreeListAsyncRuleModule } from 'devextreme-angular/ui/tree-list/nested';\nimport { DxoTreeListAtModule } from 'devextreme-angular/ui/tree-list/nested';\nimport { DxoTreeListBoundaryOffsetModule } from 'devextreme-angular/ui/tree-list/nested';\nimport { DxiTreeListButtonModule } from 'devextreme-angular/ui/tree-list/nested';\nimport { DxiTreeListButtonItemModule } from 'devextreme-angular/ui/tree-list/nested';\nimport { DxoTreeListButtonOptionsModule } from 'devextreme-angular/ui/tree-list/nested';\nimport { DxiTreeListChangeModule } from 'devextreme-angular/ui/tree-list/nested';\nimport { DxoTreeListColCountByScreenModule } from 'devextreme-angular/ui/tree-list/nested';\nimport { DxoTreeListCollisionModule } from 'devextreme-angular/ui/tree-list/nested';\nimport { DxiTreeListColumnModule } from 'devextreme-angular/ui/tree-list/nested';\nimport { DxiTreeListColumnButtonModule } from 'devextreme-angular/ui/tree-list/nested';\nimport { DxoTreeListColumnChooserModule } from 'devextreme-angular/ui/tree-list/nested';\nimport { DxoTreeListColumnChooserSearchModule } from 'devextreme-angular/ui/tree-list/nested';\nimport { DxoTreeListColumnChooserSelectionModule } from 'devextreme-angular/ui/tree-list/nested';\nimport { DxoTreeListColumnFixingModule } from 'devextreme-angular/ui/tree-list/nested';\nimport { DxoTreeListColumnFixingTextsModule } from 'devextreme-angular/ui/tree-list/nested';\nimport { DxoTreeListColumnHeaderFilterModule } from 'devextreme-angular/ui/tree-list/nested';\nimport { DxoTreeListColumnHeaderFilterSearchModule } from 'devextreme-angular/ui/tree-list/nested';\nimport { DxoTreeListColumnLookupModule } from 'devextreme-angular/ui/tree-list/nested';\nimport { DxiTreeListCompareRuleModule } from 'devextreme-angular/ui/tree-list/nested';\nimport { DxoTreeListCursorOffsetModule } from 'devextreme-angular/ui/tree-list/nested';\nimport { DxiTreeListCustomOperationModule } from 'devextreme-angular/ui/tree-list/nested';\nimport { DxiTreeListCustomRuleModule } from 'devextreme-angular/ui/tree-list/nested';\nimport { DxoTreeListEditingModule } from 'devextreme-angular/ui/tree-list/nested';\nimport { DxoTreeListEditingTextsModule } from 'devextreme-angular/ui/tree-list/nested';\nimport { DxoTreeListEditorOptionsModule } from 'devextreme-angular/ui/tree-list/nested';\nimport { DxiTreeListEditorOptionsButtonModule } from 'devextreme-angular/ui/tree-list/nested';\nimport { DxiTreeListEmailRuleModule } from 'devextreme-angular/ui/tree-list/nested';\nimport { DxiTreeListEmptyItemModule } from 'devextreme-angular/ui/tree-list/nested';\nimport { DxiTreeListFieldModule } from 'devextreme-angular/ui/tree-list/nested';\nimport { DxoTreeListFieldLookupModule } from 'devextreme-angular/ui/tree-list/nested';\nimport { DxoTreeListFilterBuilderModule } from 'devextreme-angular/ui/tree-list/nested';\nimport { DxoTreeListFilterBuilderPopupModule } from 'devextreme-angular/ui/tree-list/nested';\nimport { DxoTreeListFilterOperationDescriptionsModule } from 'devextreme-angular/ui/tree-list/nested';\nimport { DxoTreeListFilterPanelModule } from 'devextreme-angular/ui/tree-list/nested';\nimport { DxoTreeListFilterPanelTextsModule } from 'devextreme-angular/ui/tree-list/nested';\nimport { DxoTreeListFilterRowModule } from 'devextreme-angular/ui/tree-list/nested';\nimport { DxoTreeListFormModule } from 'devextreme-angular/ui/tree-list/nested';\nimport { DxoTreeListFormatModule } from 'devextreme-angular/ui/tree-list/nested';\nimport { DxoTreeListFormItemModule } from 'devextreme-angular/ui/tree-list/nested';\nimport { DxoTreeListFromModule } from 'devextreme-angular/ui/tree-list/nested';\nimport { DxiTreeListGroupItemModule } from 'devextreme-angular/ui/tree-list/nested';\nimport { DxoTreeListGroupOperationDescriptionsModule } from 'devextreme-angular/ui/tree-list/nested';\nimport { DxoTreeListHeaderFilterModule } from 'devextreme-angular/ui/tree-list/nested';\nimport { DxoTreeListHideModule } from 'devextreme-angular/ui/tree-list/nested';\nimport { DxoTreeListIconsModule } from 'devextreme-angular/ui/tree-list/nested';\nimport { DxoTreeListIndicatorOptionsModule } from 'devextreme-angular/ui/tree-list/nested';\nimport { DxiTreeListItemModule } from 'devextreme-angular/ui/tree-list/nested';\nimport { DxoTreeListKeyboardNavigationModule } from 'devextreme-angular/ui/tree-list/nested';\nimport { DxoTreeListLabelModule } from 'devextreme-angular/ui/tree-list/nested';\nimport { DxoTreeListLoadPanelModule } from 'devextreme-angular/ui/tree-list/nested';\nimport { DxoTreeListLookupModule } from 'devextreme-angular/ui/tree-list/nested';\nimport { DxoTreeListMyModule } from 'devextreme-angular/ui/tree-list/nested';\nimport { DxiTreeListNumericRuleModule } from 'devextreme-angular/ui/tree-list/nested';\nimport { DxoTreeListOffsetModule } from 'devextreme-angular/ui/tree-list/nested';\nimport { DxoTreeListOperationDescriptionsModule } from 'devextreme-angular/ui/tree-list/nested';\nimport { DxoTreeListOptionsModule } from 'devextreme-angular/ui/tree-list/nested';\nimport { DxoTreeListPagerModule } from 'devextreme-angular/ui/tree-list/nested';\nimport { DxoTreeListPagingModule } from 'devextreme-angular/ui/tree-list/nested';\nimport { DxiTreeListPatternRuleModule } from 'devextreme-angular/ui/tree-list/nested';\nimport { DxoTreeListPopupModule } from 'devextreme-angular/ui/tree-list/nested';\nimport { DxoTreeListPositionModule } from 'devextreme-angular/ui/tree-list/nested';\nimport { DxiTreeListRangeRuleModule } from 'devextreme-angular/ui/tree-list/nested';\nimport { DxoTreeListRemoteOperationsModule } from 'devextreme-angular/ui/tree-list/nested';\nimport { DxiTreeListRequiredRuleModule } from 'devextreme-angular/ui/tree-list/nested';\nimport { DxoTreeListRowDraggingModule } from 'devextreme-angular/ui/tree-list/nested';\nimport { DxoTreeListScrollingModule } from 'devextreme-angular/ui/tree-list/nested';\nimport { DxoTreeListSearchModule } from 'devextreme-angular/ui/tree-list/nested';\nimport { DxoTreeListSearchPanelModule } from 'devextreme-angular/ui/tree-list/nested';\nimport { DxoTreeListSelectionModule } from 'devextreme-angular/ui/tree-list/nested';\nimport { DxoTreeListShowModule } from 'devextreme-angular/ui/tree-list/nested';\nimport { DxiTreeListSimpleItemModule } from 'devextreme-angular/ui/tree-list/nested';\nimport { DxoTreeListSortingModule } from 'devextreme-angular/ui/tree-list/nested';\nimport { DxoTreeListStateStoringModule } from 'devextreme-angular/ui/tree-list/nested';\nimport { DxiTreeListStringLengthRuleModule } from 'devextreme-angular/ui/tree-list/nested';\nimport { DxiTreeListTabModule } from 'devextreme-angular/ui/tree-list/nested';\nimport { DxiTreeListTabbedItemModule } from 'devextreme-angular/ui/tree-list/nested';\nimport { DxoTreeListTabPanelOptionsModule } from 'devextreme-angular/ui/tree-list/nested';\nimport { DxiTreeListTabPanelOptionsItemModule } from 'devextreme-angular/ui/tree-list/nested';\nimport { DxoTreeListTextsModule } from 'devextreme-angular/ui/tree-list/nested';\nimport { DxoTreeListToModule } from 'devextreme-angular/ui/tree-list/nested';\nimport { DxoTreeListToolbarModule } from 'devextreme-angular/ui/tree-list/nested';\nimport { DxiTreeListToolbarItemModule } from 'devextreme-angular/ui/tree-list/nested';\nimport { DxoTreeListTreeListHeaderFilterModule } from 'devextreme-angular/ui/tree-list/nested';\nimport { DxoTreeListTreeListHeaderFilterSearchModule } from 'devextreme-angular/ui/tree-list/nested';\nimport { DxoTreeListTreeListHeaderFilterTextsModule } from 'devextreme-angular/ui/tree-list/nested';\nimport { DxoTreeListTreeListSelectionModule } from 'devextreme-angular/ui/tree-list/nested';\nimport { DxiTreeListTreeListToolbarItemModule } from 'devextreme-angular/ui/tree-list/nested';\nimport { DxiTreeListValidationRuleModule } from 'devextreme-angular/ui/tree-list/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_tabs,\n           PROPERTY_TOKEN_toolbarItems,\n     } from 'devextreme-angular/core/tokens';\n\n\n/**\n * The TreeList is a UI component that represents data from a local or remote source in the form of a multi-column tree view. This UI component offers such features as sorting, filtering, editing, selection, etc.\n\n */\n@Component({\n    selector: 'dx-tree-list',\n    template: '',\n    host: { ngSkipHydration: 'true' },\n    imports: [ DxIntegrationModule ],\n    providers: [\n        DxTemplateHost,\n        WatcherHelper,\n        NestedOptionHost,\n        IterableDifferHelper\n    ]\n})\nexport class DxTreeListComponent<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_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    instance: DxTreeList<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    @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     * Specifies whether all rows are expanded.\n    \n     */\n    @Input()\n    get autoExpandAll(): boolean {\n        return this._getOption('autoExpandAll');\n    }\n    set autoExpandAll(value: boolean) {\n        this._setOption('autoExpandAll', 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 &apos;widget&apos;.\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     * Configures columns.\n    \n     */\n    @Input()\n    get columns(): Array<dxTreeListColumn | string> {\n        return this._getOption('columns');\n    }\n    set columns(value: Array<dxTreeListColumn | 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<dxTreeListColumn>) => void) {\n        return this._getOption('customizeColumns');\n    }\n    set customizeColumns(value: ((columns: Array<dxTreeListColumn>) => void)) {\n        this._setOption('customizeColumns', 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     * Notifies the UI component of the used data structure.\n    \n     */\n    @Input()\n    get dataStructure(): DataStructure {\n        return this._getOption('dataStructure');\n    }\n    set dataStructure(value: DataStructure) {\n        this._setOption('dataStructure', 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 | ((options: { component: dxTreeList, row: dxTreeListRowObject }) => boolean), allowDeleting?: boolean | ((options: { component: dxTreeList, row: dxTreeListRowObject }) => boolean), allowUpdating?: boolean | ((options: { component: dxTreeList, row: dxTreeListRowObject }) => boolean), changes?: Array<DataChange>, confirmDelete?: boolean, editColumnName?: string, editRowKey?: any, form?: dxFormOptions, mode?: GridsEditMode, popup?: dxPopupOptions<any>, refreshMode?: GridsEditRefreshMode, selectTextOnEditStart?: boolean, startEditAction?: StartEditAction, texts?: { addRow?: string, addRowToNode?: string, cancelAllChanges?: string, cancelRowChanges?: string, confirmDeleteMessage?: string, confirmDeleteTitle?: string, deleteRow?: string, editRow?: string, saveAllChanges?: string, saveRowChanges?: string, undeleteRow?: string, validationCancelChanges?: string }, useIcons?: boolean } {\n        return this._getOption('editing');\n    }\n    set editing(value: { allowAdding?: boolean | ((options: { component: dxTreeList, row: dxTreeListRowObject }) => boolean), allowDeleting?: boolean | ((options: { component: dxTreeList, row: dxTreeListRowObject }) => boolean), allowUpdating?: boolean | ((options: { component: dxTreeList, row: dxTreeListRowObject }) => boolean), changes?: Array<DataChange>, confirmDelete?: boolean, editColumnName?: string, editRowKey?: any, form?: dxFormOptions, mode?: GridsEditMode, popup?: dxPopupOptions<any>, refreshMode?: GridsEditRefreshMode, selectTextOnEditStart?: boolean, startEditAction?: StartEditAction, texts?: { addRow?: string, addRowToNode?: string, cancelAllChanges?: string, cancelRowChanges?: string, confirmDeleteMessage?: string, confirmDeleteTitle?: string, deleteRow?: string, editRow?: string, saveAllChanges?: string, saveRowChanges?: string, undeleteRow?: string, validationCancelChanges?: string }, useIcons?: boolean }) {\n        this._setOption('editing', value);\n    }\n\n\n    /**\n     * Specifies the global attributes to be attached to the UI component&apos;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     * Specifies expanded rows with keys.\n    \n     */\n    @Input()\n    get expandedRowKeys(): Array<any> {\n        return this._getOption('expandedRowKeys');\n    }\n    set expandedRowKeys(value: Array<any>) {\n        this._setOption('expandedRowKeys', value);\n    }\n\n\n    /**\n     * Specifies whether nodes appear expanded or collapsed after filtering is applied.\n    \n     */\n    @Input()\n    get expandNodesOnFiltering(): boolean {\n        return this._getOption('expandNodesOnFiltering');\n    }\n    set expandNodesOnFiltering(value: boolean) {\n        this._setOption('expandNodesOnFiltering', 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     * Specifies whether filter and search results should include matching rows only, matching rows with ancestors, or matching rows with ancestors and descendants (full branch).\n    \n     */\n    @Input()\n    get filterMode(): TreeListFilterMode {\n        return this._getOption('filterMode');\n    }\n    set filterMode(value: TreeListFilterMode) {\n        this._setOption('filterMode', 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&apos;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&apos;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     * Specifies which data field defines whether the node has children.\n    \n     */\n    @Input()\n    get hasItemsExpr(): ((item: any, value: boolean | undefined) => boolean | undefined) | string {\n        return this._getOption('hasItemsExpr');\n    }\n    set hasItemsExpr(value: ((item: any, value: boolean | undefined) => boolean | undefined) | string) {\n        this._setOption('hasItemsExpr', 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&apos;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     * Specifies which data field contains nested items. Set this property when your data has a hierarchical structure.\n    \n     */\n    @Input()\n    get itemsExpr(): ((item: any, value: undefined | Array<any>) => Array<any> | undefined) | string {\n        return this._getOption('itemsExpr');\n    }\n    set itemsExpr(value: ((item: any, value: undefined | Array<any>) => Array<any> | undefined) | string) {\n        this._setOption('itemsExpr', 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.\n    \n     */\n    @Input()\n    get keyExpr(): ((item: any, value: any) => any) | string {\n        return this._getOption('keyExpr');\n    }\n    set keyExpr(value: ((item: any, value: any) => any) | string) {\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     * 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 which data field provides parent keys.\n    \n     */\n    @Input()\n    get parentIdExpr(): ((item: any, value: any) => any | undefined) | string {\n        return this._getOption('parentIdExpr');\n    }\n    set parentIdExpr(value: ((item: any, value: any) => any | undefined) | string) {\n        this._setOption('parentIdExpr', value);\n    }\n\n\n    /**\n     * Notifies the TreeList of the server&apos;s data processing operations. Applies only if data has a plain structure.\n    \n     */\n    @Input()\n    get remoteOperations(): Mode | { filtering?: boolean, grouping?: boolean, sorting?: boolean } {\n        return this._getOption('remoteOperations');\n    }\n    set remoteOperations(value: Mode | { filtering?: boolean, grouping?: boolean, sorting?: 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 the root key. Applies if dataStructure is &apos;plain&apos;.\n    \n     */\n    @Input()\n    get rootValue(): any {\n        return this._getOption('rootValue');\n    }\n    set rootValue(value: any) {\n        this._setOption('rootValue', 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     * 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?: ScrollMode, 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?: ScrollMode, 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, mode?: SingleMultipleOrNone, recursive?: boolean } {\n        return this._getOption('selection');\n    }\n    set selection(value: { allowSelectAll?: boolean, mode?: SingleMultipleOrNone, recursive?: boolean }) {\n        this._setOption('selection', value);\n    }\n\n\n    /**\n     * Specifies whether the outer borders of the UI component are visible.\n    \n     */\n    @Input()\n    get showBorders(): boolean {\n        return this._getOption('showBorders');\n    }\n    set showBorders(value: boolean) {\n        this._setOption('showBorders', value);\n    }\n\n\n    /**\n     * Specifies whether column headers are visible.\n    \n     */\n    @Input()\n    get showColumnHeaders(): boolean {\n        return this._getOption('showColumnHeaders');\n    }\n    set showColumnHeaders(value: boolean) {\n        this._setOption('showColumnHeaders', value);\n    }\n\n\n    /**\n     * Specifies whether vertical lines that separate one column from another are visible.\n    \n     */\n    @Input()\n    get showColumnLines(): boolean {\n        return this._getOption('showColumnLines');\n    }\n    set showColumnLines(value: boolean) {\n        this._setOption('showColumnLines', value);\n    }\n\n\n    /**\n     * Specifies whether horizontal lines that separate one row from another are visible.\n    \n     */\n    @Input()\n    get showRowLines(): boolean {\n        return this._getOption('showRowLines');\n    }\n    set showRowLines(value: boolean) {\n        this._setOption('showRowLines', value);\n    }\n\n\n    /**\n     * Configures runtime sorting.\n    \n     */\n    @Input()\n    get sorting(): Sorting {\n        return this._getOption('sorting');\n    }\n    set sorting(value: Sorting) {\n        this._setOption('sorting', value);\n    }\n\n\n    /**\n     * Configures state storing.\n    \n     */\n    @Input()\n    get stateStoring(): { customLoad?: Function, customSave?: ((gridState: any) => void), enabled?: boolean, savingTimeout?: number, storageKey?: string, type?: StateStoreType } {\n        return this._getOption('stateStoring');\n    }\n    set stateStoring(value: { customLoad?: Function, customSave?: ((gridState: any) => void), enabled?: boolean, savingTimeout?: number, storageKey?: string, type?: StateStoreType }) {\n        this._setOption('stateStoring', value);\n    }\n\n\n    /**