@catull/igniteui-angular
Version:
Ignite UI for Angular is a dependency-free Angular toolkit for building modern web apps
82 lines • 12.3 kB
JavaScript
import { __decorate, __extends, __metadata, __param } from "tslib";
import { Component, ChangeDetectorRef, ElementRef, ViewChild, Inject, ChangeDetectionStrategy, NgZone, OnInit, Input, TemplateRef } from '@angular/core';
import { GridBaseAPIService } from '../api.service';
import { getNodeSizeViaRange, PlatformUtil } from '../../core/utils';
import { DOCUMENT } from '@angular/common';
import { IgxGridSelectionService, IgxGridCRUDService } from '../selection/selection.service';
import { HammerGesturesManager } from '../../core/touch';
import { IgxGridExpandableCellComponent } from '../grid/expandable-cell.component';
var IgxTreeGridCellComponent = /** @class */ (function (_super) {
__extends(IgxTreeGridCellComponent, _super);
function IgxTreeGridCellComponent(selectionService, crudService, gridAPI, cdr, element, zone, touchManager, document, platformUtil) {
var _this = _super.call(this, selectionService, crudService, gridAPI, cdr, element, zone, touchManager, document, platformUtil) || this;
_this.zone = zone;
_this.document = document;
_this.platformUtil = platformUtil;
/**
* @hidden
*/
_this.level = 0;
/**
* @hidden
*/
_this.showIndicator = false;
_this.treeGridAPI = gridAPI;
return _this;
}
/**
* @hidden
*/
IgxTreeGridCellComponent.prototype.toggle = function (event) {
event.stopPropagation();
this.treeGridAPI.trigger_row_expansion_toggle(this.row.treeRow, !this.row.expanded, event, this.visibleColumnIndex);
};
/**
* @hidden
*/
IgxTreeGridCellComponent.prototype.onLoadingDblClick = function (event) {
event.stopPropagation();
};
IgxTreeGridCellComponent.ctorParameters = function () { return [
{ type: IgxGridSelectionService },
{ type: IgxGridCRUDService },
{ type: GridBaseAPIService },
{ type: ChangeDetectorRef },
{ type: ElementRef },
{ type: NgZone },
{ type: HammerGesturesManager },
{ type: undefined, decorators: [{ type: Inject, args: [DOCUMENT,] }] },
{ type: PlatformUtil }
]; };
__decorate([
Input(),
__metadata("design:type", Object)
], IgxTreeGridCellComponent.prototype, "level", void 0);
__decorate([
Input(),
__metadata("design:type", Object)
], IgxTreeGridCellComponent.prototype, "showIndicator", void 0);
__decorate([
Input(),
__metadata("design:type", Boolean)
], IgxTreeGridCellComponent.prototype, "isLoading", void 0);
IgxTreeGridCellComponent = __decorate([
Component({
changeDetection: ChangeDetectionStrategy.OnPush,
selector: 'igx-tree-grid-cell',
template: "<ng-template #defaultCell>\n <div igxTextHighlight style=\"pointer-events: none\" [cssClass]=\"highlightClass\" [activeCssClass]=\"activeHighlightClass\" [groupName]=\"gridID\"\n [value]=\"formatter ? formatter(value) : column.dataType === 'number' ? (value | igxdecimal: grid.locale) : column.dataType === 'date' ? (value | igxdate: grid.locale) : value\"\n [row]=\"rowData\" [column]=\"this.column.field\" [containerClass]=\"'igx-grid__td-text'\"\n class=\"igx-grid__td-text\">{{ formatter ? formatter(value) : column.dataType === 'number' ? (value | igxdecimal:\n grid.locale) : column.dataType === 'date' ? (value | igxdate: grid.locale) : value }}</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]=\"focused\">\n </igx-input-group>\n </ng-container>\n <ng-container *ngIf=\"column.dataType === 'number'\">\n <igx-input-group displayDensity=\"compact\">\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 [style.width.%]=\"100\" [outlet]=\"grid.outletDirective\" mode=\"dropdown\"\n [locale]=\"grid.locale\" [(value)]=\"editValue\" [igxFocus]=\"focused\" [labelVisibility]=\"false\">\n </igx-date-picker>\n </ng-container>\n</ng-template>\n<ng-container *ngIf=\"!editMode\">\n <ng-container *ngIf=\"level > 0\">\n <div #indentationDiv class=\"igx-grid__tree-cell--padding-level-{{level}}\"></div>\n </ng-container>\n <div #indicator\n *ngIf=\"!isLoading\"\n class=\"igx-grid__tree-grouping-indicator\"\n [ngStyle]=\"{'visibility': showIndicator ? 'visible' : 'hidden'}\"\n (click)=\"toggle($event)\" (focus)=\"onIndicatorFocus()\" tabindex=\"-1\">\n <ng-container *ngTemplateOutlet=\"iconTemplate; context: { $implicit: this }\">\n </ng-container>\n </div>\n <div *ngIf=\"isLoading\"\n (dblclick)=\"onLoadingDblClick($event)\"\n class=\"igx-grid__tree-loading-indicator\">\n <ng-container *ngTemplateOutlet=\"grid.rowLoadingIndicatorTemplate ? grid.rowLoadingIndicatorTemplate : defaultLoadingIndicatorTemplate\">\n </ng-container>\n </div>\n <ng-template #defaultLoadingIndicatorTemplate>\n <igx-circular-bar [indeterminate]=\"true\">\n </igx-circular-bar>\n </ng-template>\n</ng-container>\n<ng-container *ngTemplateOutlet=\"template; context: context\">\n</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]
}),
__param(7, Inject(DOCUMENT)),
__metadata("design:paramtypes", [IgxGridSelectionService,
IgxGridCRUDService,
GridBaseAPIService,
ChangeDetectorRef,
ElementRef,
NgZone,
HammerGesturesManager, Object, PlatformUtil])
], IgxTreeGridCellComponent);
return IgxTreeGridCellComponent;
}(IgxGridExpandableCellComponent));
export { IgxTreeGridCellComponent };
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoidHJlZS1jZWxsLmNvbXBvbmVudC5qcyIsInNvdXJjZVJvb3QiOiJuZzovL2lnbml0ZXVpLWFuZ3VsYXIvIiwic291cmNlcyI6WyJsaWIvZ3JpZHMvdHJlZS1ncmlkL3RyZWUtY2VsbC5jb21wb25lbnQudHMiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IjtBQUFBLE9BQU8sRUFBRSxTQUFTLEVBQUUsaUJBQWlCLEVBQUUsVUFBVSxFQUFFLFNBQVMsRUFBRSxNQUFNLEVBQy9ELHVCQUF1QixFQUFFLE1BQU0sRUFBRSxNQUFNLEVBQUUsS0FBSyxFQUFFLFdBQVcsRUFBRSxNQUFNLGVBQWUsQ0FBQztBQUd4RixPQUFPLEVBQUUsa0JBQWtCLEVBQUUsTUFBTSxnQkFBZ0IsQ0FBQztBQUNwRCxPQUFPLEVBQUUsbUJBQW1CLEVBQUUsWUFBWSxFQUFFLE1BQU0sa0JBQWtCLENBQUM7QUFDckUsT0FBTyxFQUFFLFFBQVEsRUFBRSxNQUFNLGlCQUFpQixDQUFDO0FBRTNDLE9BQU8sRUFBRSx1QkFBdUIsRUFBRSxrQkFBa0IsRUFBRSxNQUFNLGdDQUFnQyxDQUFDO0FBQzdGLE9BQU8sRUFBRSxxQkFBcUIsRUFBRSxNQUFNLGtCQUFrQixDQUFDO0FBRXpELE9BQU8sRUFBRSw4QkFBOEIsRUFBRSxNQUFNLG1DQUFtQyxDQUFDO0FBUW5GO0lBQThDLDRDQUE4QjtJQUd4RSxrQ0FDWSxnQkFBeUMsRUFDekMsV0FBK0IsRUFDL0IsT0FBNEQsRUFDNUQsR0FBc0IsRUFDdEIsT0FBbUIsRUFDVCxJQUFZLEVBQ3RCLFlBQW1DLEVBQ1YsUUFBUSxFQUN2QixZQUEwQjtRQVRoRCxZQVVJLGtCQUFNLGdCQUFnQixFQUFFLFdBQVcsRUFBRSxPQUFPLEVBQUUsR0FBRyxFQUFFLE9BQU8sRUFBRSxJQUFJLEVBQUUsWUFBWSxFQUFFLFFBQVEsRUFBRSxZQUFZLENBQUMsU0FFMUc7UUFOcUIsVUFBSSxHQUFKLElBQUksQ0FBUTtRQUVHLGNBQVEsR0FBUixRQUFRLENBQUE7UUFDdkIsa0JBQVksR0FBWixZQUFZLENBQWM7UUFLaEQ7O1dBRUc7UUFFSCxXQUFLLEdBQUcsQ0FBQyxDQUFDO1FBRVY7O1dBRUc7UUFFSCxtQkFBYSxHQUFHLEtBQUssQ0FBQztRQWJsQixLQUFJLENBQUMsV0FBVyxHQUEwQixPQUFPLENBQUM7O0lBQ3RELENBQUM7SUFxQkQ7O09BRUc7SUFDSSx5Q0FBTSxHQUFiLFVBQWMsS0FBWTtRQUN0QixLQUFLLENBQUMsZUFBZSxFQUFFLENBQUM7UUFDeEIsSUFBSSxDQUFDLFdBQVcsQ0FBQyw0QkFBNEIsQ0FBQyxJQUFJLENBQUMsR0FBRyxDQUFDLE9BQU8sRUFBRSxDQUFDLElBQUksQ0FBQyxHQUFHLENBQUMsUUFBUSxFQUFFLEtBQUssRUFBRSxJQUFJLENBQUMsa0JBQWtCLENBQUMsQ0FBQztJQUN4SCxDQUFDO0lBRUQ7O09BRUc7SUFDSSxvREFBaUIsR0FBeEIsVUFBeUIsS0FBWTtRQUNqQyxLQUFLLENBQUMsZUFBZSxFQUFFLENBQUM7SUFDNUIsQ0FBQzs7Z0JBN0M2Qix1QkFBdUI7Z0JBQzVCLGtCQUFrQjtnQkFDdEIsa0JBQWtCO2dCQUN0QixpQkFBaUI7Z0JBQ2IsVUFBVTtnQkFDSCxNQUFNO2dCQUNSLHFCQUFxQjtnREFDbEMsTUFBTSxTQUFDLFFBQVE7Z0JBQ1EsWUFBWTs7SUFTaEQ7UUFEQyxLQUFLLEVBQUU7OzJEQUNFO0lBTVY7UUFEQyxLQUFLLEVBQUU7O21FQUNjO0lBT3RCO1FBREMsS0FBSyxFQUFFOzsrREFDa0I7SUFsQ2pCLHdCQUF3QjtRQU5wQyxTQUFTLENBQUM7WUFDUCxlQUFlLEVBQUUsdUJBQXVCLENBQUMsTUFBTTtZQUMvQyxRQUFRLEVBQUUsb0JBQW9CO1lBQzlCLDBwR0FBdUM7WUFDdkMsU0FBUyxFQUFFLENBQUMscUJBQXFCLENBQUM7U0FDckMsQ0FBQztRQVllLFdBQUEsTUFBTSxDQUFDLFFBQVEsQ0FBQyxDQUFBO3lDQVBDLHVCQUF1QjtZQUM1QixrQkFBa0I7WUFDdEIsa0JBQWtCO1lBQ3RCLGlCQUFpQjtZQUNiLFVBQVU7WUFDSCxNQUFNO1lBQ1IscUJBQXFCLFVBRVgsWUFBWTtPQVp2Qyx3QkFBd0IsQ0FrRHBDO0lBQUQsK0JBQUM7Q0FBQSxBQWxERCxDQUE4Qyw4QkFBOEIsR0FrRDNFO1NBbERZLHdCQUF3QiIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCB7IENvbXBvbmVudCwgQ2hhbmdlRGV0ZWN0b3JSZWYsIEVsZW1lbnRSZWYsIFZpZXdDaGlsZCwgSW5qZWN0LFxuICAgICBDaGFuZ2VEZXRlY3Rpb25TdHJhdGVneSwgTmdab25lLCBPbkluaXQsIElucHV0LCBUZW1wbGF0ZVJlZiB9IGZyb20gJ0Bhbmd1bGFyL2NvcmUnO1xuaW1wb3J0IHsgSWd4R3JpZENlbGxDb21wb25lbnQgfSBmcm9tICcuLi9jZWxsLmNvbXBvbmVudCc7XG5pbXBvcnQgeyBJZ3hUcmVlR3JpZEFQSVNlcnZpY2UgfSBmcm9tICcuL3RyZWUtZ3JpZC1hcGkuc2VydmljZSc7XG5pbXBvcnQgeyBHcmlkQmFzZUFQSVNlcnZpY2UgfSBmcm9tICcuLi9hcGkuc2VydmljZSc7XG5pbXBvcnQgeyBnZXROb2RlU2l6ZVZpYVJhbmdlLCBQbGF0Zm9ybVV0aWwgfSBmcm9tICcuLi8uLi9jb3JlL3V0aWxzJztcbmltcG9ydCB7IERPQ1VNRU5UIH0gZnJvbSAnQGFuZ3VsYXIvY29tbW9uJztcbmltcG9ydCB7IElneEdyaWRCYXNlRGlyZWN0aXZlIH0gZnJvbSAnLi4vZ3JpZCc7XG5pbXBvcnQgeyBJZ3hHcmlkU2VsZWN0aW9uU2VydmljZSwgSWd4R3JpZENSVURTZXJ2aWNlIH0gZnJvbSAnLi4vc2VsZWN0aW9uL3NlbGVjdGlvbi5zZXJ2aWNlJztcbmltcG9ydCB7IEhhbW1lckdlc3R1cmVzTWFuYWdlciB9IGZyb20gJy4uLy4uL2NvcmUvdG91Y2gnO1xuaW1wb3J0IHsgR3JpZFR5cGUgfSBmcm9tICcuLi9jb21tb24vZ3JpZC5pbnRlcmZhY2UnO1xuaW1wb3J0IHsgSWd4R3JpZEV4cGFuZGFibGVDZWxsQ29tcG9uZW50IH0gZnJvbSAnLi4vZ3JpZC9leHBhbmRhYmxlLWNlbGwuY29tcG9uZW50JztcblxuQENvbXBvbmVudCh7XG4gICAgY2hhbmdlRGV0ZWN0aW9uOiBDaGFuZ2VEZXRlY3Rpb25TdHJhdGVneS5PblB1c2gsXG4gICAgc2VsZWN0b3I6ICdpZ3gtdHJlZS1ncmlkLWNlbGwnLFxuICAgIHRlbXBsYXRlVXJsOiAndHJlZS1jZWxsLmNvbXBvbmVudC5odG1sJyxcbiAgICBwcm92aWRlcnM6IFtIYW1tZXJHZXN0dXJlc01hbmFnZXJdXG59KVxuZXhwb3J0IGNsYXNzIElneFRyZWVHcmlkQ2VsbENvbXBvbmVudCBleHRlbmRzIElneEdyaWRFeHBhbmRhYmxlQ2VsbENvbXBvbmVudCB7XG4gICAgcHJpdmF0ZSB0cmVlR3JpZEFQSTogSWd4VHJlZUdyaWRBUElTZXJ2aWNlO1xuXG4gICAgY29uc3RydWN0b3IoXG4gICAgICAgICAgICAgICAgc2VsZWN0aW9uU2VydmljZTogSWd4R3JpZFNlbGVjdGlvblNlcnZpY2UsXG4gICAgICAgICAgICAgICAgY3J1ZFNlcnZpY2U6IElneEdyaWRDUlVEU2VydmljZSxcbiAgICAgICAgICAgICAgICBncmlkQVBJOiBHcmlkQmFzZUFQSVNlcnZpY2U8SWd4R3JpZEJhc2VEaXJlY3RpdmUgJiBHcmlkVHlwZT4sXG4gICAgICAgICAgICAgICAgY2RyOiBDaGFuZ2VEZXRlY3RvclJlZixcbiAgICAgICAgICAgICAgICBlbGVtZW50OiBFbGVtZW50UmVmLFxuICAgICAgICAgICAgICAgIHByb3RlY3RlZCB6b25lOiBOZ1pvbmUsXG4gICAgICAgICAgICAgICAgdG91Y2hNYW5hZ2VyOiBIYW1tZXJHZXN0dXJlc01hbmFnZXIsXG4gICAgICAgICAgICAgICAgQEluamVjdChET0NVTUVOVCkgcHVibGljIGRvY3VtZW50LFxuICAgICAgICAgICAgICAgIHByb3RlY3RlZCBwbGF0Zm9ybVV0aWw6IFBsYXRmb3JtVXRpbCkge1xuICAgICAgICBzdXBlcihzZWxlY3Rpb25TZXJ2aWNlLCBjcnVkU2VydmljZSwgZ3JpZEFQSSwgY2RyLCBlbGVtZW50LCB6b25lLCB0b3VjaE1hbmFnZXIsIGRvY3VtZW50LCBwbGF0Zm9ybVV0aWwpO1xuICAgICAgICB0aGlzLnRyZWVHcmlkQVBJID0gPElneFRyZWVHcmlkQVBJU2VydmljZT5ncmlkQVBJO1xuICAgIH1cblxuICAgIC8qKlxuICAgICAqIEBoaWRkZW5cbiAgICAgKi9cbiAgICBASW5wdXQoKVxuICAgIGxldmVsID0gMDtcblxuICAgIC8qKlxuICAgICAqIEBoaWRkZW5cbiAgICAgKi9cbiAgICBASW5wdXQoKVxuICAgIHNob3dJbmRpY2F0b3IgPSBmYWxzZTtcblxuXG4gICAgLyoqXG4gICAgICogQGhpZGRlblxuICAgICAqL1xuICAgIEBJbnB1dCgpXG4gICAgcHVibGljIGlzTG9hZGluZzogYm9vbGVhbjtcblxuICAgIC8qKlxuICAgICAqIEBoaWRkZW5cbiAgICAgKi9cbiAgICBwdWJsaWMgdG9nZ2xlKGV2ZW50OiBFdmVudCkge1xuICAgICAgICBldmVudC5zdG9wUHJvcGFnYXRpb24oKTtcbiAgICAgICAgdGhpcy50cmVlR3JpZEFQSS50cmlnZ2VyX3Jvd19leHBhbnNpb25fdG9nZ2xlKHRoaXMucm93LnRyZWVSb3csICF0aGlzLnJvdy5leHBhbmRlZCwgZXZlbnQsIHRoaXMudmlzaWJsZUNvbHVtbkluZGV4KTtcbiAgICB9XG5cbiAgICAvKipcbiAgICAgKiBAaGlkZGVuXG4gICAgICovXG4gICAgcHVibGljIG9uTG9hZGluZ0RibENsaWNrKGV2ZW50OiBFdmVudCkge1xuICAgICAgICBldmVudC5zdG9wUHJvcGFnYXRpb24oKTtcbiAgICB9XG59XG4iXX0=