/*!
 * devextreme-angular-test
 * Version: 17.2.8
 * Build date: Mon Feb 05 2018
 *
 * Copyright (c) 2012 - 2018 Developer Express Inc. ALL RIGHTS RESERVED
 *
 * This software may be modified and distributed under the terms
 * of the MIT license. See the LICENSE file in the root of the project for details.
 *
 * https://github.com/DevExpress/devextreme-angular
 */











import {
    Component,
    NgModule,
    ElementRef,
    NgZone,
    Input,
    Output,
    OnDestroy,
    Injector,
    EventEmitter,
    OnChanges,
    DoCheck,
    SimpleChanges,
    ContentChildren,
    QueryList
} from '@angular/core';


import DevExpress from 'devextreme/bundles/dx.all';

import DxDataGrid from 'devextreme/ui/data_grid';


import { DxComponent } from '../core/component';
import { DxTemplateHost } from '../core/template-host';
import { DxTemplateModule } from '../core/template';
import { EventsRegistrator } from '../core/events-strategy';
import { NestedOptionHost } from '../core/nested-option';
import { WatcherHelper } from '../core/watcher-helper';
import { IterableDifferHelper } from '../core/iterable-differ-helper';

import { DxoColumnChooserModule } from './nested/column-chooser';
import { DxoColumnFixingModule } from './nested/column-fixing';
import { DxoTextsModule } from './nested/texts';
import { DxiColumnModule } from './nested/column-dxi';
import { DxoHeaderFilterModule } from './nested/header-filter';
import { DxoLookupModule } from './nested/lookup';
import { DxoFormatModule } from './nested/format';
import { DxoFormItemModule } from './nested/form-item';
import { DxoLabelModule } from './nested/label';
import { DxiValidationRuleModule } from './nested/validation-rule-dxi';
import { DxoEditingModule } from './nested/editing';
import { DxoFormModule } from './nested/form';
import { DxoColCountByScreenModule } from './nested/col-count-by-screen';
import { DxiItemModule } from './nested/item-dxi';
import { DxoTabPanelOptionsModule } from './nested/tab-panel-options';
import { DxiTabModule } from './nested/tab-dxi';
import { DxoPopupModule } from './nested/popup';
import { DxoAnimationModule } from './nested/animation';
import { DxoHideModule } from './nested/hide';
import { DxoShowModule } from './nested/show';
import { DxoPositionModule } from './nested/position';
import { DxoAtModule } from './nested/at';
import { DxoBoundaryOffsetModule } from './nested/boundary-offset';
import { DxoCollisionModule } from './nested/collision';
import { DxoMyModule } from './nested/my';
import { DxoOffsetModule } from './nested/offset';
import { DxiToolbarItemModule } from './nested/toolbar-item-dxi';
import { DxoExportModule } from './nested/export';
import { DxoFilterRowModule } from './nested/filter-row';
import { DxoOperationDescriptionsModule } from './nested/operation-descriptions';
import { DxoGroupingModule } from './nested/grouping';
import { DxoGroupPanelModule } from './nested/group-panel';
import { DxoLoadPanelModule } from './nested/load-panel';
import { DxoMasterDetailModule } from './nested/master-detail';
import { DxoPagerModule } from './nested/pager';
import { DxoPagingModule } from './nested/paging';
import { DxoRemoteOperationsModule } from './nested/remote-operations';
import { DxoScrollingModule } from './nested/scrolling';
import { DxoSearchPanelModule } from './nested/search-panel';
import { DxoSelectionModule } from './nested/selection';
import { DxiSortByGroupSummaryInfoModule } from './nested/sort-by-group-summary-info-dxi';
import { DxoSortingModule } from './nested/sorting';
import { DxoStateStoringModule } from './nested/state-storing';
import { DxoSummaryModule } from './nested/summary';
import { DxiGroupItemModule } from './nested/group-item-dxi';
import { DxoValueFormatModule } from './nested/value-format';
import { DxiTotalItemModule } from './nested/total-item-dxi';

import { DxiColumnComponent } from './nested/column-dxi';
import { DxiSortByGroupSummaryInfoComponent } from './nested/sort-by-group-summary-info-dxi';




/**
 * The DataGrid is a widget that represents data from a local or remote source in the form of a grid. This widget offers such basic features as sorting, grouping, filtering, as well as more advanced capabilities, like state storing, export to Excel, master-detail interface, and many others.
 */
@Component({
    selector: 'dx-data-grid',
    template: '',
    providers: [
        DxTemplateHost,
        WatcherHelper,
        NestedOptionHost,
        IterableDifferHelper
    ]
})
export class DxDataGridComponent extends DxComponent implements OnDestroy, OnChanges, DoCheck {
    instance: DxDataGrid;


    /**
     * Specifies the shortcut key that sets focus on the widget.
     */
    @Input()
    get accessKey(): string {
        return this._getOption('accessKey');
    }
    set accessKey(value: string) {
        this._setOption('accessKey', value);
    }


    /**
     * Specifies whether or not the widget changes its state when interacting with a user.
     */
    @Input()
    get activeStateEnabled(): boolean {
        return this._getOption('activeStateEnabled');
    }
    set activeStateEnabled(value: boolean) {
        this._setOption('activeStateEnabled', value);
    }


    /**
     * Specifies whether a user can reorder columns.
     */
    @Input()
    get allowColumnReordering(): boolean {
        return this._getOption('allowColumnReordering');
    }
    set allowColumnReordering(value: boolean) {
        this._setOption('allowColumnReordering', value);
    }


    /**
     * Specifies whether a user can resize columns.
     */
    @Input()
    get allowColumnResizing(): boolean {
        return this._getOption('allowColumnResizing');
    }
    set allowColumnResizing(value: boolean) {
        this._setOption('allowColumnResizing', value);
    }


    /**
     * Specifies whether data should be cached.
     */
    @Input()
    get cacheEnabled(): boolean {
        return this._getOption('cacheEnabled');
    }
    set cacheEnabled(value: boolean) {
        this._setOption('cacheEnabled', value);
    }


    /**
     * Enables a hint that appears when a user hovers the mouse pointer over a cell with truncated content.
     */
    @Input()
    get cellHintEnabled(): boolean {
        return this._getOption('cellHintEnabled');
    }
    set cellHintEnabled(value: boolean) {
        this._setOption('cellHintEnabled', value);
    }


    /**
     * Specifies whether columns should adjust their widths to the content.
     */
    @Input()
    get columnAutoWidth(): boolean {
        return this._getOption('columnAutoWidth');
    }
    set columnAutoWidth(value: boolean) {
        this._setOption('columnAutoWidth', value);
    }


    /**
     * Configures the column chooser.
     */
    @Input()
    get columnChooser(): any {
        return this._getOption('columnChooser');
    }
    set columnChooser(value: any) {
        this._setOption('columnChooser', value);
    }


    /**
     * Configures column fixing.
     */
    @Input()
    get columnFixing(): any {
        return this._getOption('columnFixing');
    }
    set columnFixing(value: any) {
        this._setOption('columnFixing', value);
    }


    /**
     * Specifies whether the widget should hide columns to adapt to the screen or container size. Ignored if allowColumnResizing is true and columnResizingMode is "widget".
     */
    @Input()
    get columnHidingEnabled(): boolean {
        return this._getOption('columnHidingEnabled');
    }
    set columnHidingEnabled(value: boolean) {
        this._setOption('columnHidingEnabled', value);
    }


    /**
     * Specifies the minimum width of columns.
     */
    @Input()
    get columnMinWidth(): number {
        return this._getOption('columnMinWidth');
    }
    set columnMinWidth(value: number) {
        this._setOption('columnMinWidth', value);
    }


    /**
     * Specifies how the widget resizes columns. Applies only if allowColumnResizing is true.
     */
    @Input()
    get columnResizingMode(): string {
        return this._getOption('columnResizingMode');
    }
    set columnResizingMode(value: string) {
        this._setOption('columnResizingMode', value);
    }


    /**
     * An array of grid columns.
     */
    @Input()
    get columns(): any|
        Array<any> {
        return this._getOption('columns');
    }
    set columns(value: any|
        Array<any>) {
        this._setOption('columns', value);
    }


    /**
     * Specifies a function that customizes grid columns after they are created.
     */
    @Input()
    get customizeColumns(): Function {
        return this._getOption('customizeColumns');
    }
    set customizeColumns(value: Function) {
        this._setOption('customizeColumns', value);
    }


    /**
     * Customizes grid columns and data before exporting.
     */
    @Input()
    get customizeExportData(): Function {
        return this._getOption('customizeExportData');
    }
    set customizeExportData(value: Function) {
        this._setOption('customizeExportData', value);
    }


    /**
     * Specifies the origin of data for the widget.
     */
    @Input()
    get dataSource(): DevExpress.data.DataSource|
        DevExpress.data.DataSourceOptions|
        string|
        Array<any> {
        return this._getOption('dataSource');
    }
    set dataSource(value: DevExpress.data.DataSource|
        DevExpress.data.DataSourceOptions|
        string|
        Array<any>) {
        this._setOption('dataSource', value);
    }


    /**
     * Specifies date-time values' serialization format. Use it only if you do not specify the dataSource at design time.
     */
    @Input()
    get dateSerializationFormat(): string {
        return this._getOption('dateSerializationFormat');
    }
    set dateSerializationFormat(value: string) {
        this._setOption('dateSerializationFormat', value);
    }


    /**
     * Specifies whether the widget responds to user interaction.
     */
    @Input()
    get disabled(): boolean {
        return this._getOption('disabled');
    }
    set disabled(value: boolean) {
        this._setOption('disabled', value);
    }


    /**
     * Configures editing.
     */
    @Input()
    get editing(): any {
        return this._getOption('editing');
    }
    set editing(value: any) {
        this._setOption('editing', value);
    }


    /**
     * Specifies the attributes to be attached to the widget's root element.
     */
    @Input()
    get elementAttr(): any {
        return this._getOption('elementAttr');
    }
    set elementAttr(value: any) {
        this._setOption('elementAttr', value);
    }


    /**
     * Indicates whether to show the error row.
     */
    @Input()
    get errorRowEnabled(): boolean {
        return this._getOption('errorRowEnabled');
    }
    set errorRowEnabled(value: boolean) {
        this._setOption('errorRowEnabled', value);
    }


    /**
     * Configures client-side exporting.
     */
    @Input()
    get export(): any {
        return this._getOption('export');
    }
    set export(value: any) {
        this._setOption('export', value);
    }


    /**
     * Configures the filter row.
     */
    @Input()
    get filterRow(): any {
        return this._getOption('filterRow');
    }
    set filterRow(value: any) {
        this._setOption('filterRow', value);
    }


    /**
     * Specifies whether the widget can be focused using keyboard navigation.
     */
    @Input()
    get focusStateEnabled(): boolean {
        return this._getOption('focusStateEnabled');
    }
    set focusStateEnabled(value: boolean) {
        this._setOption('focusStateEnabled', value);
    }


    /**
     * Specifies grouping settings and the behavior of grouped grid records.
     */
    @Input()
    get grouping(): any {
        return this._getOption('grouping');
    }
    set grouping(value: any) {
        this._setOption('grouping', value);
    }


    /**
     * Configures the group panel.
     */
    @Input()
    get groupPanel(): any {
        return this._getOption('groupPanel');
    }
    set groupPanel(value: any) {
        this._setOption('groupPanel', value);
    }


    /**
     * Configures the header filter feature.
     */
    @Input()
    get headerFilter(): any {
        return this._getOption('headerFilter');
    }
    set headerFilter(value: any) {
        this._setOption('headerFilter', value);
    }


    /**
     * Specifies the widget's height.
     */
    @Input()
    get height(): number|
        Function|
        string {
        return this._getOption('height');
    }
    set height(value: number|
        Function|
        string) {
        this._setOption('height', value);
    }


    /**
     * Specifies text for a hint that appears when a user pauses on the widget.
     */
    @Input()
    get hint(): string {
        return this._getOption('hint');
    }
    set hint(value: string) {
        this._setOption('hint', value);
    }


    /**
     * Specifies whether the widget changes its state when a user pauses on it.
     */
    @Input()
    get hoverStateEnabled(): boolean {
        return this._getOption('hoverStateEnabled');
    }
    set hoverStateEnabled(value: boolean) {
        this._setOption('hoverStateEnabled', value);
    }


    /**
     * Specifies which data field provides keys for data items. Applies only if data is a simple array.
     */
    @Input()
    get keyExpr(): string|
        Array<string> {
        return this._getOption('keyExpr');
    }
    set keyExpr(value: string|
        Array<string>) {
        this._setOption('keyExpr', value);
    }


    /**
     * Configures the load panel.
     */
    @Input()
    get loadPanel(): any {
        return this._getOption('loadPanel');
    }
    set loadPanel(value: any) {
        this._setOption('loadPanel', value);
    }


    /**
     * Allows you to build a master-detail interface in the grid.
     */
    @Input()
    get masterDetail(): any {
        return this._getOption('masterDetail');
    }
    set masterDetail(value: any) {
        this._setOption('masterDetail', value);
    }


    /**
     * Specifies text shown when the widget does not display any data.
     */
    @Input()
    get noDataText(): string {
        return this._getOption('noDataText');
    }
    set noDataText(value: string) {
        this._setOption('noDataText', value);
    }


    /**
     * Specifies the options of a grid pager.
     */
    @Input()
    get pager(): any {
        return this._getOption('pager');
    }
    set pager(value: any) {
        this._setOption('pager', value);
    }


    /**
     * Specifies paging options.
     */
    @Input()
    get paging(): any {
        return this._getOption('paging');
    }
    set paging(value: any) {
        this._setOption('paging', value);
    }


    /**
     * Specifies the operations that must be performed on the server side.
     */
    @Input()
    get remoteOperations(): boolean|
        string|
        { filtering?: boolean, grouping?: boolean, groupPaging?: boolean, paging?: boolean, sorting?: boolean, summary?: boolean } {
        return this._getOption('remoteOperations');
    }
    set remoteOperations(value: boolean|
        string|
        { filtering?: boolean, grouping?: boolean, groupPaging?: boolean, paging?: boolean, sorting?: boolean, summary?: boolean }) {
        this._setOption('remoteOperations', value);
    }


    /**
     * Specifies whether rows should be shaded differently.
     */
    @Input()
    get rowAlternationEnabled(): boolean {
        return this._getOption('rowAlternationEnabled');
    }
    set rowAlternationEnabled(value: boolean) {
        this._setOption('rowAlternationEnabled', value);
    }


    /**
     * Specifies a custom template for grid rows.
     */
    @Input()
    get rowTemplate(): any {
        return this._getOption('rowTemplate');
    }
    set rowTemplate(value: any) {
        this._setOption('rowTemplate', value);
    }


    /**
     * Switches the widget to a right-to-left representation.
     */
    @Input()
    get rtlEnabled(): boolean {
        return this._getOption('rtlEnabled');
    }
    set rtlEnabled(value: boolean) {
        this._setOption('rtlEnabled', value);
    }


    /**
     * Configures scrolling.
     */
    @Input()
    get scrolling(): any {
        return this._getOption('scrolling');
    }
    set scrolling(value: any) {
        this._setOption('scrolling', value);
    }


    /**
     * Configures the search panel.
     */
    @Input()
    get searchPanel(): any {
        return this._getOption('searchPanel');
    }
    set searchPanel(value: any) {
        this._setOption('searchPanel', value);
    }


    /**
     * Specifies the keys of rows that must be selected initially.
     */
    @Input()
    get selectedRowKeys(): Array<any> {
        return this._getOption('selectedRowKeys');
    }
    set selectedRowKeys(value: Array<any>) {
        this._setOption('selectedRowKeys', value);
    }


    /**
     * Configures runtime selection.
     */
    @Input()
    get selection(): any {
        return this._getOption('selection');
    }
    set selection(value: any) {
        this._setOption('selection', value);
    }


    /**
     * Specifies filters for the rows that must be selected initially. Applies only if selection.deferred is true.
     */
    @Input()
    get selectionFilter(): any {
        return this._getOption('selectionFilter');
    }
    set selectionFilter(value: any) {
        this._setOption('selectionFilter', value);
    }


    /**
     * Specifies whether the outer borders of the widget are visible.
     */
    @Input()
    get showBorders(): boolean {
        return this._getOption('showBorders');
    }
    set showBorders(value: boolean) {
        this._setOption('showBorders', value);
    }


    /**
     * Specifies whether column headers are visible.
     */
    @Input()
    get showColumnHeaders(): boolean {
        return this._getOption('showColumnHeaders');
    }
    set showColumnHeaders(value: boolean) {
        this._setOption('showColumnHeaders', value);
    }


    /**
     * Specifies whether vertical lines that separate one column from another are visible.
     */
    @Input()
    get showColumnLines(): boolean {
        return this._getOption('showColumnLines');
    }
    set showColumnLines(value: boolean) {
        this._setOption('showColumnLines', value);
    }


    /**
     * Specifies whether horizontal lines that separate one row from another are visible.
     */
    @Input()
    get showRowLines(): boolean {
        return this._getOption('showRowLines');
    }
    set showRowLines(value: boolean) {
        this._setOption('showRowLines', value);
    }


    /**
     * Allows you to sort groups according to the values of group summary items.
     */
    @Input()
    get sortByGroupSummaryInfo(): Array<any|
        { groupColumn?: string, sortOrder?: string, summaryItem?: number|
        string }> {
        return this._getOption('sortByGroupSummaryInfo');
    }
    set sortByGroupSummaryInfo(value: Array<any|
        { groupColumn?: string, sortOrder?: string, summaryItem?: number|
        string }>) {
        this._setOption('sortByGroupSummaryInfo', value);
    }


    /**
     * Configures runtime sorting.
     */
    @Input()
    get sorting(): any {
        return this._getOption('sorting');
    }
    set sorting(value: any) {
        this._setOption('sorting', value);
    }


    /**
     * Specifies options of state storing.
     */
    @Input()
    get stateStoring(): any {
        return this._getOption('stateStoring');
    }
    set stateStoring(value: any) {
        this._setOption('stateStoring', value);
    }


    /**
     * Specifies the options of the grid summary.
     */
    @Input()
    get summary(): any {
        return this._getOption('summary');
    }
    set summary(value: any) {
        this._setOption('summary', value);
    }


    /**
     * Specifies the number of the element when the Tab key is used for navigating.
     */
    @Input()
    get tabIndex(): number {
        return this._getOption('tabIndex');
    }
    set tabIndex(value: number) {
        this._setOption('tabIndex', value);
    }


    /**
     * Specifies whether to enable two-way data binding.
     */
    @Input()
    get twoWayBindingEnabled(): boolean {
        return this._getOption('twoWayBindingEnabled');
    }
    set twoWayBindingEnabled(value: boolean) {
        this._setOption('twoWayBindingEnabled', value);
    }


    /**
     * Specifies whether the widget is visible.
     */
    @Input()
    get visible(): boolean {
        return this._getOption('visible');
    }
    set visible(value: boolean) {
        this._setOption('visible', value);
    }


    /**
     * Specifies the widget's width.
     */
    @Input()
    get width(): number|
        Function|
        string {
        return this._getOption('width');
    }
    set width(value: number|
        Function|
        string) {
        this._setOption('width', value);
    }


    /**
     * Specifies whether text that does not fit into a column should be wrapped.
     */
    @Input()
    get wordWrapEnabled(): boolean {
        return this._getOption('wordWrapEnabled');
    }
    set wordWrapEnabled(value: boolean) {
        this._setOption('wordWrapEnabled', value);
    }

    /**
     * A handler for the adaptiveDetailRowPreparing event. Executed before an adaptive detail row is rendered.
     */
    @Output() onAdaptiveDetailRowPreparing: EventEmitter<any>;

    /**
     * A handler for the cellClick event.
     */
    @Output() onCellClick: EventEmitter<any>;

    /**
     * A handler for the cellHoverChanged event.
     */
    @Output() onCellHoverChanged: EventEmitter<any>;

    /**
     * A handler for the cellPrepared event.
     */
    @Output() onCellPrepared: EventEmitter<any>;

    /**
     * A handler for the contentReady event. Executed when the widget's content is ready. This handler may be executed multiple times during the widget's lifetime depending on the number of times its content changes.
     */
    @Output() onContentReady: EventEmitter<any>;

    /**
     * A handler for the contextMenuPreparing event.
     */
    @Output() onContextMenuPreparing: EventEmitter<any>;

    /**
     * A handler for the dataErrorOccurred event. Executed when an error occurs in the data source.
     */
    @Output() onDataErrorOccurred: EventEmitter<any>;

    /**
     * A handler for the disposing event. Executed when the widget is removed from the DOM using the remove(), empty(), or html() jQuery methods only.
     */
    @Output() onDisposing: EventEmitter<any>;

    /**
     * A handler for the editingStart event.
     */
    @Output() onEditingStart: EventEmitter<any>;

    /**
     * A handler for the editorPrepared event.
     */
    @Output() onEditorPrepared: EventEmitter<any>;

    /**
     * A handler for the editorPreparing event.
     */
    @Output() onEditorPreparing: EventEmitter<any>;

    /**
     * A handler for the exported event.
     */
    @Output() onExported: EventEmitter<any>;

    /**
     * A handler for the exporting event.
     */
    @Output() onExporting: EventEmitter<any>;

    /**
     * A handler for the fileSaving event.
     */
    @Output() onFileSaving: EventEmitter<any>;

    /**
     * A handler for the initialized event. Executed only once, after the widget is initialized.
     */
    @Output() onInitialized: EventEmitter<any>;

    /**
     * A handler for the initNewRow event. Executed before a new row is added to the widget.
     */
    @Output() onInitNewRow: EventEmitter<any>;

    /**
     * A handler for the keyDown event. Executed when the widget is in focus and a key has been pressed down.
     */
    @Output() onKeyDown: EventEmitter<any>;

    /**
     * A handler for the optionChanged event. Executed after an option of the widget is changed.
     */
    @Output() onOptionChanged: EventEmitter<any>;

    /**
     * A handler for the rowClick event.
     */
    @Output() onRowClick: EventEmitter<any>;

    /**
     * A handler for the rowCollapsed event. Executed after a row is collapsed.
     */
    @Output() onRowCollapsed: EventEmitter<any>;

    /**
     * A handler for the rowCollapsing event. Executed before a row is collapsed.
     */
    @Output() onRowCollapsing: EventEmitter<any>;

    /**
     * A handler for the rowExpanded event. Executed after a row is expanded.
     */
    @Output() onRowExpanded: EventEmitter<any>;

    /**
     * A handler for the rowExpanding event. Executed before a row is expanded.
     */
    @Output() onRowExpanding: EventEmitter<any>;

    /**
     * A handler for the rowInserted event. Executed after a new row has been inserted into the data source.
     */
    @Output() onRowInserted: EventEmitter<any>;

    /**
     * A handler for the rowInserting event. Executed before a new row is inserted into the data source.
     */
    @Output() onRowInserting: EventEmitter<any>;

    /**
     * A handler for the rowPrepared event.
     */
    @Output() onRowPrepared: EventEmitter<any>;

    /**
     * A handler for the rowRemoved event. Executed after a row has been removed from the data source.
     */
    @Output() onRowRemoved: EventEmitter<any>;

    /**
     * A handler for the rowRemoving event. Executed before a row is removed from the data source.
     */
    @Output() onRowRemoving: EventEmitter<any>;

    /**
     * A handler for the rowUpdated event. Executed after a row has been updated in the data source.
     */
    @Output() onRowUpdated: EventEmitter<any>;

    /**
     * A handler for the rowUpdating event. Executed before a row is updated in the data source.
     */
    @Output() onRowUpdating: EventEmitter<any>;

    /**
     * A handler for the rowValidating event. Executed after cells in a row are validated against validation rules.
     */
    @Output() onRowValidating: EventEmitter<any>;

    /**
     * A handler for the selectionChanged event. Executed after selecting a row or clearing its selection.
     */
    @Output() onSelectionChanged: EventEmitter<any>;

    /**
     * A handler for the toolbarPreparing event. Executed before the toolbar is created.
     */
    @Output() onToolbarPreparing: EventEmitter<any>;

    /**
     * A handler for the accessKeyChange event.
     */
    @Output() accessKeyChange: EventEmitter<string>;

    /**
     * A handler for the activeStateEnabledChange event.
     */
    @Output() activeStateEnabledChange: EventEmitter<boolean>;

    /**
     * A handler for the allowColumnReorderingChange event.
     */
    @Output() allowColumnReorderingChange: EventEmitter<boolean>;

    /**
     * A handler for the allowColumnResizingChange event.
     */
    @Output() allowColumnResizingChange: EventEmitter<boolean>;

    /**
     * A handler for the cacheEnabledChange event.
     */
    @Output() cacheEnabledChange: EventEmitter<boolean>;

    /**
     * A handler for the cellHintEnabledChange event.
     */
    @Output() cellHintEnabledChange: EventEmitter<boolean>;

    /**
     * A handler for the columnAutoWidthChange event.
     */
    @Output() columnAutoWidthChange: EventEmitter<boolean>;

    /**
     * A handler for the columnChooserChange event.
     */
    @Output() columnChooserChange: EventEmitter<any>;

    /**
     * A handler for the columnFixingChange event.
     */
    @Output() columnFixingChange: EventEmitter<any>;

    /**
     * A handler for the columnHidingEnabledChange event.
     */
    @Output() columnHidingEnabledChange: EventEmitter<boolean>;

    /**
     * A handler for the columnMinWidthChange event.
     */
    @Output() columnMinWidthChange: EventEmitter<number>;

    /**
     * A handler for the columnResizingModeChange event.
     */
    @Output() columnResizingModeChange: EventEmitter<string>;

    /**
     * A handler for the columnsChange event.
     */
    @Output() columnsChange: EventEmitter<any|
        Array<any>>;

    /**
     * A handler for the customizeColumnsChange event.
     */
    @Output() customizeColumnsChange: EventEmitter<Function>;

    /**
     * A handler for the customizeExportDataChange event.
     */
    @Output() customizeExportDataChange: EventEmitter<Function>;

    /**
     * A handler for the dataSourceChange event.
     */
    @Output() dataSourceChange: EventEmitter<DevExpress.data.DataSource|
        DevExpress.data.DataSourceOptions|
        string|
        Array<any>>;

    /**
     * A handler for the dateSerializationFormatChange event.
     */
    @Output() dateSerializationFormatChange: EventEmitter<string>;

    /**
     * A handler for the disabledChange event.
     */
    @Output() disabledChange: EventEmitter<boolean>;

    /**
     * A handler for the editingChange event.
     */
    @Output() editingChange: EventEmitter<any>;

    /**
     * A handler for the elementAttrChange event.
     */
    @Output() elementAttrChange: EventEmitter<any>;

    /**
     * A handler for the errorRowEnabledChange event.
     */
    @Output() errorRowEnabledChange: EventEmitter<boolean>;

    /**
     * A handler for the exportChange event.
     */
    @Output() exportChange: EventEmitter<any>;

    /**
     * A handler for the filterRowChange event.
     */
    @Output() filterRowChange: EventEmitter<any>;

    /**
     * A handler for the focusStateEnabledChange event.
     */
    @Output() focusStateEnabledChange: EventEmitter<boolean>;

    /**
     * A handler for the groupingChange event.
     */
    @Output() groupingChange: EventEmitter<any>;

    /**
     * A handler for the groupPanelChange event.
     */
    @Output() groupPanelChange: EventEmitter<any>;

    /**
     * A handler for the headerFilterChange event.
     */
    @Output() headerFilterChange: EventEmitter<any>;

    /**
     * A handler for the heightChange event.
     */
    @Output() heightChange: EventEmitter<number|
        Function|
        string>;

    /**
     * A handler for the hintChange event.
     */
    @Output() hintChange: EventEmitter<string>;

    /**
     * A handler for the hoverStateEnabledChange event.
     */
    @Output() hoverStateEnabledChange: EventEmitter<boolean>;

    /**
     * A handler for the keyExprChange event.
     */
    @Output() keyExprChange: EventEmitter<string|
        Array<string>>;

    /**
     * A handler for the loadPanelChange event.
     */
    @Output() loadPanelChange: EventEmitter<any>;

    /**
     * A handler for the masterDetailChange event.
     */
    @Output() masterDetailChange: EventEmitter<any>;

    /**
     * A handler for the noDataTextChange event.
     */
    @Output() noDataTextChange: EventEmitter<string>;

    /**
     * A handler for the pagerChange event.
     */
    @Output() pagerChange: EventEmitter<any>;

    /**
     * A handler for the pagingChange event.
     */
    @Output() pagingChange: EventEmitter<any>;

    /**
     * A handler for the remoteOperationsChange event.
     */
    @Output() remoteOperationsChange: EventEmitter<boolean|
        string|
        { filtering?: boolean, grouping?: boolean, groupPaging?: boolean, paging?: boolean, sorting?: boolean, summary?: boolean }>;

    /**
     * A handler for the rowAlternationEnabledChange event.
     */
    @Output() rowAlternationEnabledChange: EventEmitter<boolean>;

    /**
     * A handler for the rowTemplateChange event.
     */
    @Output() rowTemplateChange: EventEmitter<any>;

    /**
     * A handler for the rtlEnabledChange event.
     */
    @Output() rtlEnabledChange: EventEmitter<boolean>;

    /**
     * A handler for the scrollingChange event.
     */
    @Output() scrollingChange: EventEmitter<any>;

    /**
     * A handler for the searchPanelChange event.
     */
    @Output() searchPanelChange: EventEmitter<any>;

    /**
     * A handler for the selectedRowKeysChange event.
     */
    @Output() selectedRowKeysChange: EventEmitter<Array<any>>;

    /**
     * A handler for the selectionChange event.
     */
    @Output() selectionChange: EventEmitter<any>;

    /**
     * A handler for the selectionFilterChange event.
     */
    @Output() selectionFilterChange: EventEmitter<any>;

    /**
     * A handler for the showBordersChange event.
     */
    @Output() showBordersChange: EventEmitter<boolean>;

    /**
     * A handler for the showColumnHeadersChange event.
     */
    @Output() showColumnHeadersChange: EventEmitter<boolean>;

    /**
     * A handler for the showColumnLinesChange event.
     */
    @Output() showColumnLinesChange: EventEmitter<boolean>;

    /**
     * A handler for the showRowLinesChange event.
     */
    @Output() showRowLinesChange: EventEmitter<boolean>;

    /**
     * A handler for the sortByGroupSummaryInfoChange event.
     */
    @Output() sortByGroupSummaryInfoChange: EventEmitter<Array<any|
        { groupColumn?: string, sortOrder?: string, summaryItem?: number|
        string }>>;

    /**
     * A handler for the sortingChange event.
     */
    @Output() sortingChange: EventEmitter<any>;

    /**
     * A handler for the stateStoringChange event.
     */
    @Output() stateStoringChange: EventEmitter<any>;

    /**
     * A handler for the summaryChange event.
     */
    @Output() summaryChange: EventEmitter<any>;

    /**
     * A handler for the tabIndexChange event.
     */
    @Output() tabIndexChange: EventEmitter<number>;

    /**
     * A handler for the twoWayBindingEnabledChange event.
     */
    @Output() twoWayBindingEnabledChange: EventEmitter<boolean>;

    /**
     * A handler for the visibleChange event.
     */
    @Output() visibleChange: EventEmitter<boolean>;

    /**
     * A handler for the widthChange event.
     */
    @Output() widthChange: EventEmitter<number|
        Function|
        string>;

    /**
     * A handler for the wordWrapEnabledChange event.
     */
    @Output() wordWrapEnabledChange: EventEmitter<boolean>;




    @ContentChildren(DxiColumnComponent)
    get columnsChildren(): QueryList<DxiColumnComponent> {
        return this._getOption('columns');
    }
    set columnsChildren(value) {
        this.setChildren('columns', value);
    }

    @ContentChildren(DxiSortByGroupSummaryInfoComponent)
    get sortByGroupSummaryInfoChildren(): QueryList<DxiSortByGroupSummaryInfoComponent> {
        return this._getOption('sortByGroupSummaryInfo');
    }
    set sortByGroupSummaryInfoChildren(value) {
        this.setChildren('sortByGroupSummaryInfo', value);
    }


    constructor(elementRef: ElementRef, ngZone: NgZone, templateHost: DxTemplateHost, injector: Injector,
            private _watcherHelper: WatcherHelper,
            private _idh: IterableDifferHelper, optionHost: NestedOptionHost) {

        super(elementRef, ngZone, templateHost, _watcherHelper);
        injector.get(EventsRegistrator);

        this._createEventEmitters([
            { subscribe: 'adaptiveDetailRowPreparing', emit: 'onAdaptiveDetailRowPreparing' },
            { subscribe: 'cellClick', emit: 'onCellClick' },
            { subscribe: 'cellHoverChanged', emit: 'onCellHoverChanged' },
            { subscribe: 'cellPrepared', emit: 'onCellPrepared' },
            { subscribe: 'contentReady', emit: 'onContentReady' },
            { subscribe: 'contextMenuPreparing', emit: 'onContextMenuPreparing' },
            { subscribe: 'dataErrorOccurred', emit: 'onDataErrorOccurred' },
            { subscribe: 'disposing', emit: 'onDisposing' },
            { subscribe: 'editingStart', emit: 'onEditingStart' },
            { subscribe: 'editorPrepared', emit: 'onEditorPrepared' },
            { subscribe: 'editorPreparing', emit: 'onEditorPreparing' },
            { subscribe: 'exported', emit: 'onExported' },
            { subscribe: 'exporting', emit: 'onExporting' },
            { subscribe: 'fileSaving', emit: 'onFileSaving' },
            { subscribe: 'initialized', emit: 'onInitialized' },
            { subscribe: 'initNewRow', emit: 'onInitNewRow' },
            { subscribe: 'keyDown', emit: 'onKeyDown' },
            { subscribe: 'optionChanged', emit: 'onOptionChanged' },
            { subscribe: 'rowClick', emit: 'onRowClick' },
            { subscribe: 'rowCollapsed', emit: 'onRowCollapsed' },
            { subscribe: 'rowCollapsing', emit: 'onRowCollapsing' },
            { subscribe: 'rowExpanded', emit: 'onRowExpanded' },
            { subscribe: 'rowExpanding', emit: 'onRowExpanding' },
            { subscribe: 'rowInserted', emit: 'onRowInserted' },
            { subscribe: 'rowInserting', emit: 'onRowInserting' },
            { subscribe: 'rowPrepared', emit: 'onRowPrepared' },
            { subscribe: 'rowRemoved', emit: 'onRowRemoved' },
            { subscribe: 'rowRemoving', emit: 'onRowRemoving' },
            { subscribe: 'rowUpdated', emit: 'onRowUpdated' },
            { subscribe: 'rowUpdating', emit: 'onRowUpdating' },
            { subscribe: 'rowValidating', emit: 'onRowValidating' },
            { subscribe: 'selectionChanged', emit: 'onSelectionChanged' },
            { subscribe: 'toolbarPreparing', emit: 'onToolbarPreparing' },
            { emit: 'accessKeyChange' },
            { emit: 'activeStateEnabledChange' },
            { emit: 'allowColumnReorderingChange' },
            { emit: 'allowColumnResizingChange' },
            { emit: 'cacheEnabledChange' },
            { emit: 'cellHintEnabledChange' },
            { emit: 'columnAutoWidthChange' },
            { emit: 'columnChooserChange' },
            { emit: 'columnFixingChange' },
            { emit: 'columnHidingEnabledChange' },
            { emit: 'columnMinWidthChange' },
            { emit: 'columnResizingModeChange' },
            { emit: 'columnsChange' },
            { emit: 'customizeColumnsChange' },
            { emit: 'customizeExportDataChange' },
            { emit: 'dataSourceChange' },
            { emit: 'dateSerializationFormatChange' },
            { emit: 'disabledChange' },
            { emit: 'editingChange' },
            { emit: 'elementAttrChange' },
            { emit: 'errorRowEnabledChange' },
            { emit: 'exportChange' },
            { emit: 'filterRowChange' },
            { emit: 'focusStateEnabledChange' },
            { emit: 'groupingChange' },
            { emit: 'groupPanelChange' },
            { emit: 'headerFilterChange' },
            { emit: 'heightChange' },
            { emit: 'hintChange' },
            { emit: 'hoverStateEnabledChange' },
            { emit: 'keyExprChange' },
            { emit: 'loadPanelChange' },
            { emit: 'masterDetailChange' },
            { emit: 'noDataTextChange' },
            { emit: 'pagerChange' },
            { emit: 'pagingChange' },
            { emit: 'remoteOperationsChange' },
            { emit: 'rowAlternationEnabledChange' },
            { emit: 'rowTemplateChange' },
            { emit: 'rtlEnabledChange' },
            { emit: 'scrollingChange' },
            { emit: 'searchPanelChange' },
            { emit: 'selectedRowKeysChange' },
            { emit: 'selectionChange' },
            { emit: 'selectionFilterChange' },
            { emit: 'showBordersChange' },
            { emit: 'showColumnHeadersChange' },
            { emit: 'showColumnLinesChange' },
            { emit: 'showRowLinesChange' },
            { emit: 'sortByGroupSummaryInfoChange' },
            { emit: 'sortingChange' },
            { emit: 'stateStoringChange' },
            { emit: 'summaryChange' },
            { emit: 'tabIndexChange' },
            { emit: 'twoWayBindingEnabledChange' },
            { emit: 'visibleChange' },
            { emit: 'widthChange' },
            { emit: 'wordWrapEnabledChange' }
        ]);

        this._idh.setHost(this);
        optionHost.setHost(this);
    }

    protected _createInstance(element, options) {
        return new DxDataGrid(element, options);
    }

    ngOnDestroy() {
        this._destroyWidget();
    }

    ngOnChanges(changes: SimpleChanges) {
        super.ngOnChanges(changes);
        this.setupChanges('columns', changes);
        this.setupChanges('dataSource', changes);
        this.setupChanges('keyExpr', changes);
        this.setupChanges('selectedRowKeys', changes);
        this.setupChanges('sortByGroupSummaryInfo', changes);
    }

    setupChanges(prop: string, changes: SimpleChanges) {
        if (!(prop in this._optionsToUpdate)) {
            this._idh.setup(prop, changes);
        }
    }

    ngDoCheck() {
        this._idh.doCheck('columns');
        this._idh.doCheck('dataSource');
        this._idh.doCheck('keyExpr');
        this._idh.doCheck('selectedRowKeys');
        this._idh.doCheck('sortByGroupSummaryInfo');
        this._watcherHelper.checkWatchers();
        super.ngDoCheck();
    }

    _setOption(name: string, value: any) {
        let isSetup = this._idh.setupSingle(name, value);
        let isChanged = this._idh.getChanges(name, value) !== null;

        if (isSetup || isChanged) {
            super._setOption(name, value);
        }
    }

}

@NgModule({
  imports: [
    DxoColumnChooserModule,
    DxoColumnFixingModule,
    DxoTextsModule,
    DxiColumnModule,
    DxoHeaderFilterModule,
    DxoLookupModule,
    DxoFormatModule,
    DxoFormItemModule,
    DxoLabelModule,
    DxiValidationRuleModule,
    DxoEditingModule,
    DxoFormModule,
    DxoColCountByScreenModule,
    DxiItemModule,
    DxoTabPanelOptionsModule,
    DxiTabModule,
    DxoPopupModule,
    DxoAnimationModule,
    DxoHideModule,
    DxoShowModule,
    DxoPositionModule,
    DxoAtModule,
    DxoBoundaryOffsetModule,
    DxoCollisionModule,
    DxoMyModule,
    DxoOffsetModule,
    DxiToolbarItemModule,
    DxoExportModule,
    DxoFilterRowModule,
    DxoOperationDescriptionsModule,
    DxoGroupingModule,
    DxoGroupPanelModule,
    DxoLoadPanelModule,
    DxoMasterDetailModule,
    DxoPagerModule,
    DxoPagingModule,
    DxoRemoteOperationsModule,
    DxoScrollingModule,
    DxoSearchPanelModule,
    DxoSelectionModule,
    DxiSortByGroupSummaryInfoModule,
    DxoSortingModule,
    DxoStateStoringModule,
    DxoSummaryModule,
    DxiGroupItemModule,
    DxoValueFormatModule,
    DxiTotalItemModule,
    DxTemplateModule
  ],
  declarations: [
    DxDataGridComponent
  ],
  exports: [
    DxDataGridComponent,
    DxoColumnChooserModule,
    DxoColumnFixingModule,
    DxoTextsModule,
    DxiColumnModule,
    DxoHeaderFilterModule,
    DxoLookupModule,
    DxoFormatModule,
    DxoFormItemModule,
    DxoLabelModule,
    DxiValidationRuleModule,
    DxoEditingModule,
    DxoFormModule,
    DxoColCountByScreenModule,
    DxiItemModule,
    DxoTabPanelOptionsModule,
    DxiTabModule,
    DxoPopupModule,
    DxoAnimationModule,
    DxoHideModule,
    DxoShowModule,
    DxoPositionModule,
    DxoAtModule,
    DxoBoundaryOffsetModule,
    DxoCollisionModule,
    DxoMyModule,
    DxoOffsetModule,
    DxiToolbarItemModule,
    DxoExportModule,
    DxoFilterRowModule,
    DxoOperationDescriptionsModule,
    DxoGroupingModule,
    DxoGroupPanelModule,
    DxoLoadPanelModule,
    DxoMasterDetailModule,
    DxoPagerModule,
    DxoPagingModule,
    DxoRemoteOperationsModule,
    DxoScrollingModule,
    DxoSearchPanelModule,
    DxoSelectionModule,
    DxiSortByGroupSummaryInfoModule,
    DxoSortingModule,
    DxoStateStoringModule,
    DxoSummaryModule,
    DxiGroupItemModule,
    DxoValueFormatModule,
    DxiTotalItemModule,
    DxTemplateModule
  ],
  providers: [EventsRegistrator]

})
export class DxDataGridModule { }