import { ChangeDetectionStrategy, Component, Input } from '@angular/core';
import { HammerGesturesManager } from '../../core/touch';
import { IgxGridExpandableCellComponent } from '../grid/expandable-cell.component';
export class IgxTreeGridCellComponent extends IgxGridExpandableCellComponent {
    constructor() {
        super(...arguments);
        /**
         * @hidden
         */
        this.level = 0;
        /**
         * @hidden
         */
        this.showIndicator = false;
    }
    get treeGridAPI() {
        return this.gridAPI;
    }
    /**
     * @hidden
     */
    toggle(event) {
        event.stopPropagation();
        this.treeGridAPI.set_row_expansion_state(this.row.rowID, !this.row.expanded, event);
    }
    /**
     * @hidden
     */
    onLoadingDblClick(event) {
        event.stopPropagation();
    }
}
IgxTreeGridCellComponent.decorators = [
    { type: Component, args: [{
                changeDetection: ChangeDetectionStrategy.OnPush,
                selector: 'igx-tree-grid-cell',
                template: "<ng-template #defaultPinnedIndicator>\n    <igx-chip\n        *ngIf=\"displayPinnedChip\"\n        class=\"igx-grid__td--pinned-chip\"\n        [disabled]=\"true\"\n        [displayDensity]=\"'compact'\"\n        >{{ grid.resourceStrings.igx_grid_pinned_row_indicator }}</igx-chip\n    >\n</ng-template>\n<ng-template #defaultCell>\n    <div *ngIf=\"column.dataType !== 'boolean' || (column.dataType === 'boolean' && this.formatter)\"\n        igxTextHighlight\n        class=\"igx-grid__td-text\"\n        style=\"pointer-events: none;\"\n        [cssClass]=\"highlightClass\"\n        [activeCssClass]=\"activeHighlightClass\"\n        [groupName]=\"gridID\"\n        [value]=\"\n            formatter\n                ? (value | columnFormatter: formatter)\n                : column.dataType === 'number'\n                ? (value | number:column.pipeArgs.digitsInfo:grid.locale)\n                : column.dataType === 'date'\n                ? (value | date:column.pipeArgs.format:column.pipeArgs.timezone:grid.locale)\n                : value\n        \"\n        [row]=\"rowData\"\n        [column]=\"this.column.field\"\n        [containerClass]=\"'igx-grid__td-text'\"\n        [metadata]=\"searchMetadata\"\n    >{{\n            formatter\n                ? (value | columnFormatter: formatter)\n                : column.dataType === \"number\"\n                ? (value | number:column.pipeArgs.digitsInfo:grid.locale)\n                : column.dataType === \"date\"\n                ? (value | date:column.pipeArgs.format:column.pipeArgs.timezone:grid.locale)\n                : value\n        }}</div>\n    <igx-icon\n        *ngIf=\"column.dataType === 'boolean' && !this.formatter\"\n        [ngClass]=\"{ 'igx-icon--success': value, 'igx-icon--error': !value }\"\n        >{{ value ? \"check\" : \"close\" }}</igx-icon\n    >\n</ng-template>\n<ng-template #addRowCell let-cell=\"cell\">\n    <div *ngIf=\"column.dataType !== 'boolean' || (column.dataType === 'boolean' && this.formatter)\"\n    igxTextHighlight class=\"igx-grid__td-text\"\n    style=\"pointer-events: none\"\n    [cssClass]=\"highlightClass\"\n    [activeCssClass]=\"activeHighlightClass\"\n    [groupName]=\"gridID\"\n    [value]=\"formatter ? (value | columnFormatter:formatter) : column.dataType === 'number' ? (value | number:column.pipeArgs.digitsInfo:grid.locale) : column.dataType === 'date' ? (value | date:column.pipeArgs.format:column.pipeArgs.timezone:grid.locale) : value\"\n    [row]=\"rowData\"\n    [column]=\"this.column.field\"\n    [containerClass]=\"'igx-grid__td-text'\"\n    [metadata]=\"searchMetadata\">{{\n        !isEmptyAddRowCell ? value : (column.header || column.field)\n    }}</div>\n</ng-template>\n<ng-template #inlineEditor let-cell=\"cell\">\n    <ng-container *ngIf=\"column.dataType === 'string'\">\n        <igx-input-group displayDensity=\"compact\">\n            <input igxInput [(ngModel)]=\"editValue\" [igxFocus]=\"true\" />\n        </igx-input-group>\n    </ng-container>\n    <ng-container *ngIf=\"column.dataType === 'number'\">\n        <igx-input-group displayDensity=\"compact\">\n            <input\n                igxInput\n                [(ngModel)]=\"editValue\"\n                [igxFocus]=\"true\"\n                type=\"number\"\n            />\n        </igx-input-group>\n    </ng-container>\n    <ng-container *ngIf=\"column.dataType === 'boolean'\">\n        <igx-checkbox\n            (change)=\"editValue = $event.checked\"\n            [value]=\"editValue\"\n            [checked]=\"editValue\"\n            [disableRipple]=\"true\"\n        ></igx-checkbox>\n    </ng-container>\n    <ng-container *ngIf=\"column.dataType === 'date'\">\n        <igx-date-picker\n            [style.width.%]=\"100\"\n            [outlet]=\"grid.outlet\"\n            mode=\"dropdown\"\n            [locale]=\"grid.locale\"\n            [(value)]=\"editValue\"\n            [igxFocus]=\"true\"\n            [labelVisibility]=\"false\"\n        >\n        </igx-date-picker>\n    </ng-container>\n</ng-template>\n<ng-container *ngIf=\"!editMode\">\n    <ng-container *ngIf=\"level > 0\">\n        <div\n            #indentationDiv\n            class=\"igx-grid__tree-cell--padding-level-{{ level }}\"\n        ></div>\n    </ng-container>\n    <div\n        #indicator\n        *ngIf=\"!isLoading\"\n        class=\"igx-grid__tree-grouping-indicator\"\n        [ngStyle]=\"{ visibility: showIndicator ? 'visible' : 'hidden' }\"\n        (click)=\"toggle($event)\"\n        (focus)=\"onIndicatorFocus()\"\n    >\n        <ng-container\n            *ngTemplateOutlet=\"iconTemplate; context: { $implicit:  this }\"\n        >\n        </ng-container>\n        <ng-container\n            *ngTemplateOutlet=\"pinnedIndicatorTemplate; context: context\"\n        >\n        </ng-container>\n    </div>\n    <div\n        *ngIf=\"isLoading\"\n        (dblclick)=\"onLoadingDblClick($event)\"\n        class=\"igx-grid__tree-loading-indicator\"\n    >\n        <ng-container\n            *ngTemplateOutlet=\"\n                grid.rowLoadingIndicatorTemplate\n                    ? grid.rowLoadingIndicatorTemplate\n                    : defaultLoadingIndicatorTemplate\n            \"\n        >\n        </ng-container>\n    </div>\n    <ng-template #defaultLoadingIndicatorTemplate>\n        <igx-circular-bar [indeterminate]=\"true\"> </igx-circular-bar>\n    </ng-template>\n</ng-container>\n<ng-container *ngTemplateOutlet=\"template; context: context\"> </ng-container>\n<ng-template #defaultExpandedTemplate>\n    <igx-icon fontSet=\"material\">expand_more</igx-icon>\n</ng-template>\n<ng-template #defaultCollapsedTemplate>\n    <igx-icon fontSet=\"material\">chevron_right</igx-icon>\n</ng-template>\n",
                providers: [HammerGesturesManager]
            },] }
];
IgxTreeGridCellComponent.propDecorators = {
    level: [{ type: Input }],
    showIndicator: [{ type: Input }],
    isLoading: [{ type: Input }]
};
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoidHJlZS1jZWxsLmNvbXBvbmVudC5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uLy4uLy4uL3Byb2plY3RzL2lnbml0ZXVpLWFuZ3VsYXIvc3JjL2xpYi9ncmlkcy90cmVlLWdyaWQvdHJlZS1jZWxsLmNvbXBvbmVudC50cyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFBQSxPQUFPLEVBQ0gsdUJBQXVCLEVBQ3ZCLFNBQVMsRUFDVCxLQUFLLEVBQ1IsTUFBTSxlQUFlLENBQUM7QUFFdkIsT0FBTyxFQUFFLHFCQUFxQixFQUFFLE1BQU0sa0JBQWtCLENBQUM7QUFDekQsT0FBTyxFQUFFLDhCQUE4QixFQUFFLE1BQU0sbUNBQW1DLENBQUM7QUFRbkYsTUFBTSxPQUFPLHdCQUF5QixTQUFRLDhCQUE4QjtJQU41RTs7UUFZSTs7V0FFRztRQUVILFVBQUssR0FBRyxDQUFDLENBQUM7UUFFVjs7V0FFRztRQUVILGtCQUFhLEdBQUcsS0FBSyxDQUFDO0lBc0IxQixDQUFDO0lBcENHLElBQVksV0FBVztRQUNuQixPQUFPLElBQUksQ0FBQyxPQUFnQyxDQUFDO0lBQ2pELENBQUM7SUFvQkQ7O09BRUc7SUFDSSxNQUFNLENBQUMsS0FBWTtRQUN0QixLQUFLLENBQUMsZUFBZSxFQUFFLENBQUM7UUFDeEIsSUFBSSxDQUFDLFdBQVcsQ0FBQyx1QkFBdUIsQ0FBQyxJQUFJLENBQUMsR0FBRyxDQUFDLEtBQUssRUFBRSxDQUFDLElBQUksQ0FBQyxHQUFHLENBQUMsUUFBUSxFQUFFLEtBQUssQ0FBQyxDQUFDO0lBQ3hGLENBQUM7SUFFRDs7T0FFRztJQUNJLGlCQUFpQixDQUFDLEtBQVk7UUFDakMsS0FBSyxDQUFDLGVBQWUsRUFBRSxDQUFDO0lBQzVCLENBQUM7OztZQTNDSixTQUFTLFNBQUM7Z0JBQ1AsZUFBZSxFQUFFLHVCQUF1QixDQUFDLE1BQU07Z0JBQy9DLFFBQVEsRUFBRSxvQkFBb0I7Z0JBQzlCLG1uTEFBdUM7Z0JBQ3ZDLFNBQVMsRUFBRSxDQUFDLHFCQUFxQixDQUFDO2FBQ3JDOzs7b0JBVUksS0FBSzs0QkFNTCxLQUFLO3dCQU1MLEtBQUsiLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQge1xuICAgIENoYW5nZURldGVjdGlvblN0cmF0ZWd5LFxuICAgIENvbXBvbmVudCxcbiAgICBJbnB1dFxufSBmcm9tICdAYW5ndWxhci9jb3JlJztcbmltcG9ydCB7IElneFRyZWVHcmlkQVBJU2VydmljZSB9IGZyb20gJy4vdHJlZS1ncmlkLWFwaS5zZXJ2aWNlJztcbmltcG9ydCB7IEhhbW1lckdlc3R1cmVzTWFuYWdlciB9IGZyb20gJy4uLy4uL2NvcmUvdG91Y2gnO1xuaW1wb3J0IHsgSWd4R3JpZEV4cGFuZGFibGVDZWxsQ29tcG9uZW50IH0gZnJvbSAnLi4vZ3JpZC9leHBhbmRhYmxlLWNlbGwuY29tcG9uZW50JztcblxuQENvbXBvbmVudCh7XG4gICAgY2hhbmdlRGV0ZWN0aW9uOiBDaGFuZ2VEZXRlY3Rpb25TdHJhdGVneS5PblB1c2gsXG4gICAgc2VsZWN0b3I6ICdpZ3gtdHJlZS1ncmlkLWNlbGwnLFxuICAgIHRlbXBsYXRlVXJsOiAndHJlZS1jZWxsLmNvbXBvbmVudC5odG1sJyxcbiAgICBwcm92aWRlcnM6IFtIYW1tZXJHZXN0dXJlc01hbmFnZXJdXG59KVxuZXhwb3J0IGNsYXNzIElneFRyZWVHcmlkQ2VsbENvbXBvbmVudCBleHRlbmRzIElneEdyaWRFeHBhbmRhYmxlQ2VsbENvbXBvbmVudCB7XG5cbiAgICBwcml2YXRlIGdldCB0cmVlR3JpZEFQSSgpOiBJZ3hUcmVlR3JpZEFQSVNlcnZpY2Uge1xuICAgICAgICByZXR1cm4gdGhpcy5ncmlkQVBJIGFzIElneFRyZWVHcmlkQVBJU2VydmljZTtcbiAgICB9XG5cbiAgICAvKipcbiAgICAgKiBAaGlkZGVuXG4gICAgICovXG4gICAgQElucHV0KClcbiAgICBsZXZlbCA9IDA7XG5cbiAgICAvKipcbiAgICAgKiBAaGlkZGVuXG4gICAgICovXG4gICAgQElucHV0KClcbiAgICBzaG93SW5kaWNhdG9yID0gZmFsc2U7XG5cbiAgICAvKipcbiAgICAgKiBAaGlkZGVuXG4gICAgICovXG4gICAgQElucHV0KClcbiAgICBwdWJsaWMgaXNMb2FkaW5nOiBib29sZWFuO1xuXG4gICAgLyoqXG4gICAgICogQGhpZGRlblxuICAgICAqL1xuICAgIHB1YmxpYyB0b2dnbGUoZXZlbnQ6IEV2ZW50KSB7XG4gICAgICAgIGV2ZW50LnN0b3BQcm9wYWdhdGlvbigpO1xuICAgICAgICB0aGlzLnRyZWVHcmlkQVBJLnNldF9yb3dfZXhwYW5zaW9uX3N0YXRlKHRoaXMucm93LnJvd0lELCAhdGhpcy5yb3cuZXhwYW5kZWQsIGV2ZW50KTtcbiAgICB9XG5cbiAgICAvKipcbiAgICAgKiBAaGlkZGVuXG4gICAgICovXG4gICAgcHVibGljIG9uTG9hZGluZ0RibENsaWNrKGV2ZW50OiBFdmVudCkge1xuICAgICAgICBldmVudC5zdG9wUHJvcGFnYXRpb24oKTtcbiAgICB9XG59XG4iXX0=