/**
 * @fileoverview added by tsickle
 * @suppress {checkTypes,extraRequire,missingReturn,uselessCode} checked by tsc
 */
import * as tslib_1 from "tslib";
import { Component, ChangeDetectorRef, ElementRef, ViewChild, Inject } from '@angular/core';
import { IgxGridCellComponent } from '../cell.component';
import { GridBaseAPIService } from '../api.service';
import { IgxSelectionAPIService } from '../../core/selection';
import { getNodeSizeViaRange } from '../../core/utils';
import { DOCUMENT } from '@angular/common';
var IgxTreeGridCellComponent = /** @class */ (function (_super) {
    tslib_1.__extends(IgxTreeGridCellComponent, _super);
    function IgxTreeGridCellComponent(gridAPI, selection, cdr, element, document) {
        var _this = _super.call(this, gridAPI, selection, cdr, element) || this;
        _this.document = document;
        _this.treeGridAPI = (/** @type {?} */ (gridAPI));
        return _this;
    }
    /**
     * @hidden
     */
    /**
     * @hidden
     * @return {?}
     */
    IgxTreeGridCellComponent.prototype.resolveStyleClasses = /**
     * @hidden
     * @return {?}
     */
    function () {
        return _super.prototype.resolveStyleClasses.call(this) + ' igx-grid__td--tree-cell';
    };
    Object.defineProperty(IgxTreeGridCellComponent.prototype, "indentation", {
        /**
         * @hidden
         */
        get: /**
         * @hidden
         * @return {?}
         */
        function () {
            return this.row.treeRow.level;
        },
        enumerable: true,
        configurable: true
    });
    Object.defineProperty(IgxTreeGridCellComponent.prototype, "hasChildren", {
        /**
         * @hidden
         */
        get: /**
         * @hidden
         * @return {?}
         */
        function () {
            return this.row.treeRow.children && this.row.treeRow.children.length > 0;
        },
        enumerable: true,
        configurable: true
    });
    Object.defineProperty(IgxTreeGridCellComponent.prototype, "expanded", {
        /**
         * @hidden
         */
        get: /**
         * @hidden
         * @return {?}
         */
        function () {
            return this.row.expanded;
        },
        enumerable: true,
        configurable: true
    });
    /**
     * @hidden
     */
    /**
     * @hidden
     * @param {?} event
     * @return {?}
     */
    IgxTreeGridCellComponent.prototype.toggle = /**
     * @hidden
     * @param {?} event
     * @return {?}
     */
    function (event) {
        event.stopPropagation();
        this.treeGridAPI.trigger_row_expansion_toggle(this.gridID, this.row.treeRow, !this.row.expanded, event, this.visibleColumnIndex);
    };
    /**
     * @hidden
     */
    /**
     * @hidden
     * @return {?}
     */
    IgxTreeGridCellComponent.prototype.onIndicatorFocus = /**
     * @hidden
     * @return {?}
     */
    function () {
        this.gridAPI.submit_value(this.gridID);
        this.nativeElement.focus();
    };
    /**
     * @hidden
     */
    /**
     * @hidden
     * @param {?} range
     * @return {?}
     */
    IgxTreeGridCellComponent.prototype.calculateSizeToFit = /**
     * @hidden
     * @param {?} range
     * @return {?}
     */
    function (range) {
        /** @type {?} */
        var indicatorWidth = this.indicator.nativeElement.getBoundingClientRect().width;
        /** @type {?} */
        var indicatorStyle = this.document.defaultView.getComputedStyle(this.indicator.nativeElement);
        /** @type {?} */
        var indicatorMargin = parseFloat(indicatorStyle.marginRight);
        /** @type {?} */
        var leftPadding = 0;
        if (this.indentationDiv) {
            /** @type {?} */
            var indentationStyle = this.document.defaultView.getComputedStyle(this.indentationDiv.nativeElement);
            leftPadding = parseFloat(indentationStyle.paddingLeft);
        }
        /** @type {?} */
        var largestWidth = Math.max.apply(Math, tslib_1.__spread(Array.from(this.nativeElement.children)
            .map(function (child) { return getNodeSizeViaRange(range, child); })));
        return largestWidth + indicatorWidth + indicatorMargin + leftPadding;
    };
    IgxTreeGridCellComponent.decorators = [
        { type: Component, args: [{
                    selector: 'igx-tree-grid-cell',
                    template: "<ng-template #defaultCell igxTextHighlight [cssClass]=\"highlightClass\" [activeCssClass]=\"activeHighlightClass\" [groupName]=\"gridID\"\n        [value]=\"formatter ? formatter(value) : value\" [row]=\"rowIndex\" [column]=\"this.column.visibleIndex\" [page]=\"this.grid.page\" [containerClass]=\"'igx-grid__td-text'\">\n    <ng-container *ngIf=\"column.dataType === 'boolean' || column.dataType === 'string' || formatter; else default\" >\n        <div class=\"igx-grid__td-text\">{{ formatter ? formatter(value) : value }}</div>\n    </ng-container>\n    <ng-template #default>\n        <div class=\"igx-grid__td-text\">{{ column.dataType === 'number' ? (value | igxdecimal: grid.locale) : (value | igxdate: grid.locale) }}</div>\n    </ng-template>\n</ng-template>\n<ng-template #inlineEditor  let-cell=\"cell\">\n    <ng-container *ngIf=\"column.dataType === 'string'\">\n        <igx-input-group>\n            <input igxInput [(ngModel)]=\"editValue\" [igxFocus]=\"focused\">\n        </igx-input-group>\n    </ng-container>\n    <ng-container *ngIf=\"column.dataType === 'number'\">\n        <igx-input-group>\n            <input igxInput [(ngModel)]=\"editValue\" [igxFocus]=\"focused\"  type=\"number\">\n        </igx-input-group>\n    </ng-container>\n    <ng-container *ngIf=\"column.dataType === 'boolean'\">\n        <igx-checkbox (change)=\"editValue = $event.checked\" [value]=\"editValue\" [checked]=\"editValue\" [disableRipple]=\"true\"></igx-checkbox>\n    </ng-container>\n    <ng-container *ngIf=\"column.dataType === 'date'\">\n        <igx-date-picker (onSelection)=\"editValue = $event\" [locale]=\"grid.locale\" [value]=\"editValue\" [labelVisibility]=\"false\"></igx-date-picker>\n    </ng-container>\n</ng-template>\n<ng-container *ngIf=\"!inEditMode\">\n    <ng-container *ngIf=\"indentation > 0\">\n        <div #indentationDiv class=\"igx-grid__tree-cell--padding-level-{{indentation}}\"></div>\n    </ng-container>\n    <div #indicator class=\"igx-grid__tree-grouping-indicator\" [ngStyle]=\"{'visibility': hasChildren ? 'visible' : 'hidden'}\"\n         (click)=\"toggle($event)\" (focus)=\"onIndicatorFocus()\" tabindex=\"-1\">\n        <igx-icon *ngIf=\"!expanded\" fontSet=\"material\">chevron_right</igx-icon>\n        <igx-icon *ngIf=\"expanded\" fontSet=\"material\">expand_more</igx-icon>\n    </div>\n</ng-container>\n<ng-container *ngTemplateOutlet=\"template; context: context\">\n</ng-container>\n"
                }] }
    ];
    /** @nocollapse */
    IgxTreeGridCellComponent.ctorParameters = function () { return [
        { type: GridBaseAPIService },
        { type: IgxSelectionAPIService },
        { type: ChangeDetectorRef },
        { type: ElementRef },
        { type: undefined, decorators: [{ type: Inject, args: [DOCUMENT,] }] }
    ]; };
    IgxTreeGridCellComponent.propDecorators = {
        indicator: [{ type: ViewChild, args: ['indicator', { read: ElementRef },] }],
        indentationDiv: [{ type: ViewChild, args: ['indentationDiv', { read: ElementRef },] }]
    };
    return IgxTreeGridCellComponent;
}(IgxGridCellComponent));
export { IgxTreeGridCellComponent };
if (false) {
    /** @type {?} */
    IgxTreeGridCellComponent.prototype.treeGridAPI;
    /** @type {?} */
    IgxTreeGridCellComponent.prototype.indicator;
    /** @type {?} */
    IgxTreeGridCellComponent.prototype.indentationDiv;
    /** @type {?} */
    IgxTreeGridCellComponent.prototype.document;
}
//# sourceMappingURL=data:application/json;base64, 