@tetacom/ng-components 1.0.117 → 1.0.118

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -8661,16 +8661,16 @@ class MainDropdownTabComponent {
8661
8661
  this._cdr.markForCheck();
8662
8662
  }
8663
8663
  autosizeColumn() {
8664
- this._svc.autosizeColumn(this.column, this._elementRef.nativeElement);
8664
+ this._svc.autosizeColumn(this.column, this.headCellElementRef.nativeElement);
8665
8665
  }
8666
8666
  autosizeAllColumns() {
8667
- this._svc.autosizeAllColumns(this._elementRef.nativeElement);
8667
+ this._svc.autosizeAllColumns(this.headCellElementRef.nativeElement);
8668
8668
  }
8669
8669
  ngOnInit() {
8670
8670
  }
8671
8671
  }
8672
8672
  MainDropdownTabComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.0.2", ngImport: i0, type: MainDropdownTabComponent, deps: [{ token: TableService }, { token: TetaConfigService }, { token: i0.ElementRef }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component });
8673
- MainDropdownTabComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.0.2", type: MainDropdownTabComponent, selector: "teta-main-dropdown-tab", inputs: { columns: "columns", column: "column", state: "state", data: "data", close: "close" }, ngImport: i0, template: "<div class=\"list column_auto\" *ngIf=\"locale | async as loc\">\n <ng-container *ngIf=\"!parent\">\n <div class=\"list-item list-item_interactive\"\n (click)=\"pinColumn()\">\n {{column.locked ? loc.unpin : loc.pin}}\n </div>\n <div class=\"list-divider\"></div>\n </ng-container>\n <ng-container *ngIf=\"column.sortable\">\n <div class=\"list-item list-item_interactive\"\n (click)=\"sortAsc($event)\">\n {{loc.sortAsc}}\n </div>\n <div class=\"list-item list-item_interactive\"\n (click)=\"sortDesc($event)\">\n {{loc.sortDesc}}\n </div>\n <ng-container *ngIf=\"hasSortedColumns()\">\n <div class=\"list-item list-item_interactive\"\n *ngIf=\"sortParam\"\n (click)=\"clearSort()\">\n {{loc.clearSort}}\n </div>\n <div class=\"list-item list-item_interactive\"\n (click)=\"clearAllSort()\">\n {{loc.clearAllSort}}\n </div>\n <div class=\"list-divider\"></div>\n </ng-container>\n </ng-container>\n <ng-container *ngIf=\"hasFilteredColumns()\">\n <div class=\"list-item list-item_interactive\"\n *ngIf=\"filtered\"\n (click)=\"clearFilter()\">\n {{loc.clearFilter}}\n </div>\n <div class=\"list-item list-item_interactive\"\n (click)=\"clearAllFilters()\">\n {{loc.clearAllFilters}}\n </div>\n <div class=\"list-divider\"></div>\n </ng-container>\n <div class=\"list-item list-item_interactive\" (click)=\"autosizeColumn()\">\n {{loc.autosizeColumn}}\n </div>\n <div class=\"list-item list-item_interactive\" (click)=\"autosizeAllColumns()\">\n {{loc.autosizeAll}}\n </div>\n <div class=\"list-divider\"></div>\n <div class=\"list-item list-item_interactive\" (click)=\"restoreDefaultColumns()\">\n {{loc.resetColumnsSize}}\n </div>\n</div>\n", styles: [":host{display:flex;flex-direction:column}\n"], dependencies: [{ kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "pipe", type: i2.AsyncPipe, name: "async" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
8673
+ MainDropdownTabComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.0.2", type: MainDropdownTabComponent, selector: "teta-main-dropdown-tab", inputs: { columns: "columns", column: "column", state: "state", data: "data", close: "close", headCellElementRef: "headCellElementRef" }, ngImport: i0, template: "<div class=\"list column_auto\" *ngIf=\"locale | async as loc\">\n <ng-container *ngIf=\"!parent\">\n <div class=\"list-item list-item_interactive\"\n (click)=\"pinColumn()\">\n {{column.locked ? loc.unpin : loc.pin}}\n </div>\n <div class=\"list-divider\"></div>\n </ng-container>\n <ng-container *ngIf=\"column.sortable\">\n <div class=\"list-item list-item_interactive\"\n (click)=\"sortAsc($event)\">\n {{loc.sortAsc}}\n </div>\n <div class=\"list-item list-item_interactive\"\n (click)=\"sortDesc($event)\">\n {{loc.sortDesc}}\n </div>\n <ng-container *ngIf=\"hasSortedColumns()\">\n <div class=\"list-item list-item_interactive\"\n *ngIf=\"sortParam\"\n (click)=\"clearSort()\">\n {{loc.clearSort}}\n </div>\n <div class=\"list-item list-item_interactive\"\n (click)=\"clearAllSort()\">\n {{loc.clearAllSort}}\n </div>\n <div class=\"list-divider\"></div>\n </ng-container>\n </ng-container>\n <ng-container *ngIf=\"hasFilteredColumns()\">\n <div class=\"list-item list-item_interactive\"\n *ngIf=\"filtered\"\n (click)=\"clearFilter()\">\n {{loc.clearFilter}}\n </div>\n <div class=\"list-item list-item_interactive\"\n (click)=\"clearAllFilters()\">\n {{loc.clearAllFilters}}\n </div>\n <div class=\"list-divider\"></div>\n </ng-container>\n <div class=\"list-item list-item_interactive\" (click)=\"autosizeColumn()\">\n {{loc.autosizeColumn}}\n </div>\n <div class=\"list-item list-item_interactive\" (click)=\"autosizeAllColumns()\">\n {{loc.autosizeAll}}\n </div>\n <div class=\"list-divider\"></div>\n <div class=\"list-item list-item_interactive\" (click)=\"restoreDefaultColumns()\">\n {{loc.resetColumnsSize}}\n </div>\n</div>\n", styles: [":host{display:flex;flex-direction:column}\n"], dependencies: [{ kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "pipe", type: i2.AsyncPipe, name: "async" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
8674
8674
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.0.2", ngImport: i0, type: MainDropdownTabComponent, decorators: [{
8675
8675
  type: Component,
8676
8676
  args: [{ selector: 'teta-main-dropdown-tab', changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"list column_auto\" *ngIf=\"locale | async as loc\">\n <ng-container *ngIf=\"!parent\">\n <div class=\"list-item list-item_interactive\"\n (click)=\"pinColumn()\">\n {{column.locked ? loc.unpin : loc.pin}}\n </div>\n <div class=\"list-divider\"></div>\n </ng-container>\n <ng-container *ngIf=\"column.sortable\">\n <div class=\"list-item list-item_interactive\"\n (click)=\"sortAsc($event)\">\n {{loc.sortAsc}}\n </div>\n <div class=\"list-item list-item_interactive\"\n (click)=\"sortDesc($event)\">\n {{loc.sortDesc}}\n </div>\n <ng-container *ngIf=\"hasSortedColumns()\">\n <div class=\"list-item list-item_interactive\"\n *ngIf=\"sortParam\"\n (click)=\"clearSort()\">\n {{loc.clearSort}}\n </div>\n <div class=\"list-item list-item_interactive\"\n (click)=\"clearAllSort()\">\n {{loc.clearAllSort}}\n </div>\n <div class=\"list-divider\"></div>\n </ng-container>\n </ng-container>\n <ng-container *ngIf=\"hasFilteredColumns()\">\n <div class=\"list-item list-item_interactive\"\n *ngIf=\"filtered\"\n (click)=\"clearFilter()\">\n {{loc.clearFilter}}\n </div>\n <div class=\"list-item list-item_interactive\"\n (click)=\"clearAllFilters()\">\n {{loc.clearAllFilters}}\n </div>\n <div class=\"list-divider\"></div>\n </ng-container>\n <div class=\"list-item list-item_interactive\" (click)=\"autosizeColumn()\">\n {{loc.autosizeColumn}}\n </div>\n <div class=\"list-item list-item_interactive\" (click)=\"autosizeAllColumns()\">\n {{loc.autosizeAll}}\n </div>\n <div class=\"list-divider\"></div>\n <div class=\"list-item list-item_interactive\" (click)=\"restoreDefaultColumns()\">\n {{loc.resetColumnsSize}}\n </div>\n</div>\n", styles: [":host{display:flex;flex-direction:column}\n"] }]
@@ -8684,6 +8684,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.0.2", ngImpor
8684
8684
  type: Input
8685
8685
  }], close: [{
8686
8686
  type: Input
8687
+ }], headCellElementRef: [{
8688
+ type: Input
8687
8689
  }] } });
8688
8690
 
8689
8691
  class FilterDropdownTabComponent {
@@ -9156,6 +9158,9 @@ class HeadCellComponent {
9156
9158
  }
9157
9159
  ];
9158
9160
  }
9161
+ get elementRef() {
9162
+ return this._elementRef;
9163
+ }
9159
9164
  get tabTemplates() {
9160
9165
  if (this.column?.headDropdownConfig && this.column.headDropdownConfig.tabs?.length > 0) {
9161
9166
  if (this.column.headDropdownConfig.strategy === 'replace') {
@@ -9237,10 +9242,10 @@ class HeadCellComponent {
9237
9242
  }
9238
9243
  }
9239
9244
  HeadCellComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.0.2", ngImport: i0, type: HeadCellComponent, deps: [{ token: TableService }, { token: i0.ApplicationRef }, { token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Component });
9240
- HeadCellComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.0.2", type: HeadCellComponent, selector: "teta-head-cell", inputs: { column: "column", showHeadCellMenu: "showHeadCellMenu", data: "data" }, host: { listeners: { "dragenter": "dragenter($event)", "dragover": "allowDrop($event)", "dragleave": "dragleave($event)", "dragend": "dragend($event)", "drop": "drop($event)" }, properties: { "class.table-head__cell_active": "this.dropDownOpen" } }, viewQueries: [{ propertyName: "mainTemplate", first: true, predicate: ["mainTemplate"], descendants: true, static: true }, { propertyName: "filterTemplate", first: true, predicate: ["filterTemplate"], descendants: true, static: true }, { propertyName: "columnsTemplate", first: true, predicate: ["columnsTemplate"], descendants: true, static: true }], ngImport: i0, template: "<div class=\"row row_auto\">\n <teta-dropdown [autoCloseIgnore]=\"['enter', 'inside']\"\n [verticalAlign]=\"verticalAlign.bottom\"\n [appendToBody]=\"true\"\n [(open)]=\"dropDownOpen\"\n [align]=\"align.auto\"\n (click)=\"$event.preventDefault()\"\n [class.table-head__cell__menu_open]=\"dropDownOpen\"\n class=\"column column_auto justify-content-center\">\n <div tetaDropdownHead\n draggable=\"true\"\n class=\"table-head__cell__wrapper\"\n (dragstart)=\"dragstart($event)\"\n [ngClass]=\"column.headCellClass\">\n <teta-head-cell-host [column]=\"column\" [columns]=\"columns | async\" [data]=\"data\"></teta-head-cell-host>\n <teta-icon *ngIf=\"iconName | async as icon\"\n [palette]=\"'text'\"\n [name]=\"icon\"></teta-icon>\n </div>\n <teta-head-cell-dropdown tetaDropdownContent\n *ngIf=\"showHeadCellMenu\"\n [tabTemplates]=\"tabTemplates\"\n [data]=\"data\"\n [column]=\"column\"\n [columns]=\"columns | async\"\n [state]=\"state | async\"\n [(dropDownOpen)]=\"dropDownOpen\"></teta-head-cell-dropdown>\n </teta-dropdown>\n <div class=\"drop-area\"\n draggable=\"false\"\n [class.drop-area_left]=\"showDrag === 'left'\"\n [class.drop-area_right]=\"showDrag === 'right'\"\n *ngIf=\"showDrag\"></div>\n</div>\n<div class=\"table-head__cell__resize\"\n draggable=\"false\"\n (dragstart)=\"$event.preventDefault();$event.stopPropagation()\"\n (drag)=\"$event.preventDefault();$event.stopPropagation()\"\n [tetaResizeDrag]=\"'vertical'\"\n (resizeStart)=\"resizeStart($event)\"\n (resizeProcess)=\"resizeProcess($event)\"\n (resizeEnd)=\"resizeEnd()\">\n <div class=\"table-head__cell__resize_drag\"></div>\n</div>\n<ng-template #mainTemplate let-column=\"column\" let-columns=\"columns\" let-data=\"data\" let-state=\"state\"\n let-close=\"close\">\n <teta-main-dropdown-tab [column]=\"column\" [state]=\"state\" [close]=\"close\"></teta-main-dropdown-tab>\n</ng-template>\n<ng-template #filterTemplate let-column=\"column\" let-columns=\"columns\" let-data=\"data\" let-state=\"state\"\n let-close=\"close\">\n <teta-filter-dropdown-tab [column]=\"column\"\n [state]=\"state\"\n [close]=\"close\"\n [data]=\"data\"></teta-filter-dropdown-tab>\n</ng-template>\n<ng-template #columnsTemplate let-column=\"column\" let-columns=\"columns\" let-data=\"data\" let-state=\"state\"\n let-close=\"close\">\n <teta-visibility-dropdown-tab [column]=\"column\"\n [columns]=\"columns\"\n [state]=\"state\"\n [close]=\"close\"\n [data]=\"data\"></teta-visibility-dropdown-tab>\n</ng-template>\n", styles: [".drop-area{position:absolute;width:1px;background:var(--color-text-50);top:0;bottom:0;z-index:10}.drop-area_left{left:-1px}.drop-area_right{right:-1px}\n"], dependencies: [{ kind: "directive", type: i2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: IconComponent, selector: "teta-icon", inputs: ["name", "size", "palette", "class"] }, { kind: "component", type: DropdownComponent, selector: "teta-dropdown", exportAs: ["dropdown"] }, { kind: "directive", type: DropdownHeadDirective, selector: "[tetaDropdownHead]" }, { kind: "directive", type: DropdownContentDirective, selector: "[tetaDropdownContent]" }, { kind: "directive", type: ResizeDragDirective, selector: "[tetaResizeDrag]", inputs: ["tetaResizeDrag"], outputs: ["resizeStart", "resizeProcess", "resizeEnd"] }, { kind: "component", type: HeadCellHostComponent, selector: "teta-head-cell-host", inputs: ["column", "columns", "data"] }, { kind: "component", type: HeadCellDropdownComponent, selector: "teta-head-cell-dropdown", inputs: ["columns", "column", "state", "data", "tabTemplates", "dropDownOpen"], outputs: ["dropDownOpenChange"] }, { kind: "component", type: MainDropdownTabComponent, selector: "teta-main-dropdown-tab", inputs: ["columns", "column", "state", "data", "close"] }, { kind: "component", type: FilterDropdownTabComponent, selector: "teta-filter-dropdown-tab", inputs: ["columns", "column", "state", "data", "close"] }, { kind: "component", type: VisibilityDropdownTabComponent, selector: "teta-visibility-dropdown-tab", inputs: ["columns", "column", "state", "data", "close"] }, { kind: "pipe", type: i2.AsyncPipe, name: "async" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
9245
+ HeadCellComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.0.2", type: HeadCellComponent, selector: "teta-head-cell", inputs: { column: "column", showHeadCellMenu: "showHeadCellMenu", data: "data" }, host: { listeners: { "dragenter": "dragenter($event)", "dragover": "allowDrop($event)", "dragleave": "dragleave($event)", "dragend": "dragend($event)", "drop": "drop($event)" }, properties: { "class.table-head__cell_active": "this.dropDownOpen" } }, viewQueries: [{ propertyName: "mainTemplate", first: true, predicate: ["mainTemplate"], descendants: true, static: true }, { propertyName: "filterTemplate", first: true, predicate: ["filterTemplate"], descendants: true, static: true }, { propertyName: "columnsTemplate", first: true, predicate: ["columnsTemplate"], descendants: true, static: true }], ngImport: i0, template: "<div class=\"row row_auto\">\n <teta-dropdown [autoCloseIgnore]=\"['enter', 'inside']\"\n [verticalAlign]=\"verticalAlign.bottom\"\n [appendToBody]=\"true\"\n [(open)]=\"dropDownOpen\"\n [align]=\"align.auto\"\n (click)=\"$event.preventDefault()\"\n [class.table-head__cell__menu_open]=\"dropDownOpen\"\n class=\"column column_auto justify-content-center\">\n <div tetaDropdownHead\n draggable=\"true\"\n class=\"table-head__cell__wrapper\"\n (dragstart)=\"dragstart($event)\"\n [ngClass]=\"column.headCellClass\">\n <teta-head-cell-host [column]=\"column\" [columns]=\"columns | async\" [data]=\"data\"></teta-head-cell-host>\n <teta-icon *ngIf=\"iconName | async as icon\"\n [palette]=\"'text'\"\n [name]=\"icon\"></teta-icon>\n </div>\n <teta-head-cell-dropdown tetaDropdownContent\n *ngIf=\"showHeadCellMenu\"\n [tabTemplates]=\"tabTemplates\"\n [data]=\"data\"\n [column]=\"column\"\n [columns]=\"columns | async\"\n [state]=\"state | async\"\n [(dropDownOpen)]=\"dropDownOpen\"></teta-head-cell-dropdown>\n </teta-dropdown>\n <div class=\"drop-area\"\n draggable=\"false\"\n [class.drop-area_left]=\"showDrag === 'left'\"\n [class.drop-area_right]=\"showDrag === 'right'\"\n *ngIf=\"showDrag\"></div>\n</div>\n<div class=\"table-head__cell__resize\"\n draggable=\"false\"\n (dragstart)=\"$event.preventDefault();$event.stopPropagation()\"\n (drag)=\"$event.preventDefault();$event.stopPropagation()\"\n [tetaResizeDrag]=\"'vertical'\"\n (resizeStart)=\"resizeStart($event)\"\n (resizeProcess)=\"resizeProcess($event)\"\n (resizeEnd)=\"resizeEnd()\">\n <div class=\"table-head__cell__resize_drag\"></div>\n</div>\n<ng-template #mainTemplate let-column=\"column\" let-columns=\"columns\" let-data=\"data\" let-state=\"state\"\n let-close=\"close\">\n <teta-main-dropdown-tab [column]=\"column\"\n [state]=\"state\"\n [close]=\"close\"\n [headCellElementRef]=\"elementRef\"></teta-main-dropdown-tab>\n</ng-template>\n<ng-template #filterTemplate let-column=\"column\" let-columns=\"columns\" let-data=\"data\" let-state=\"state\"\n let-close=\"close\">\n <teta-filter-dropdown-tab [column]=\"column\"\n [state]=\"state\"\n [close]=\"close\"\n [data]=\"data\"></teta-filter-dropdown-tab>\n</ng-template>\n<ng-template #columnsTemplate let-column=\"column\" let-columns=\"columns\" let-data=\"data\" let-state=\"state\"\n let-close=\"close\">\n <teta-visibility-dropdown-tab [column]=\"column\"\n [columns]=\"columns\"\n [state]=\"state\"\n [close]=\"close\"\n [data]=\"data\"></teta-visibility-dropdown-tab>\n</ng-template>\n", styles: [".drop-area{position:absolute;width:1px;background:var(--color-text-50);top:0;bottom:0;z-index:10}.drop-area_left{left:-1px}.drop-area_right{right:-1px}\n"], dependencies: [{ kind: "directive", type: i2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: IconComponent, selector: "teta-icon", inputs: ["name", "size", "palette", "class"] }, { kind: "component", type: DropdownComponent, selector: "teta-dropdown", exportAs: ["dropdown"] }, { kind: "directive", type: DropdownHeadDirective, selector: "[tetaDropdownHead]" }, { kind: "directive", type: DropdownContentDirective, selector: "[tetaDropdownContent]" }, { kind: "directive", type: ResizeDragDirective, selector: "[tetaResizeDrag]", inputs: ["tetaResizeDrag"], outputs: ["resizeStart", "resizeProcess", "resizeEnd"] }, { kind: "component", type: HeadCellHostComponent, selector: "teta-head-cell-host", inputs: ["column", "columns", "data"] }, { kind: "component", type: HeadCellDropdownComponent, selector: "teta-head-cell-dropdown", inputs: ["columns", "column", "state", "data", "tabTemplates", "dropDownOpen"], outputs: ["dropDownOpenChange"] }, { kind: "component", type: MainDropdownTabComponent, selector: "teta-main-dropdown-tab", inputs: ["columns", "column", "state", "data", "close", "headCellElementRef"] }, { kind: "component", type: FilterDropdownTabComponent, selector: "teta-filter-dropdown-tab", inputs: ["columns", "column", "state", "data", "close"] }, { kind: "component", type: VisibilityDropdownTabComponent, selector: "teta-visibility-dropdown-tab", inputs: ["columns", "column", "state", "data", "close"] }, { kind: "pipe", type: i2.AsyncPipe, name: "async" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
9241
9246
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.0.2", ngImport: i0, type: HeadCellComponent, decorators: [{
9242
9247
  type: Component,
9243
- args: [{ selector: 'teta-head-cell', changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"row row_auto\">\n <teta-dropdown [autoCloseIgnore]=\"['enter', 'inside']\"\n [verticalAlign]=\"verticalAlign.bottom\"\n [appendToBody]=\"true\"\n [(open)]=\"dropDownOpen\"\n [align]=\"align.auto\"\n (click)=\"$event.preventDefault()\"\n [class.table-head__cell__menu_open]=\"dropDownOpen\"\n class=\"column column_auto justify-content-center\">\n <div tetaDropdownHead\n draggable=\"true\"\n class=\"table-head__cell__wrapper\"\n (dragstart)=\"dragstart($event)\"\n [ngClass]=\"column.headCellClass\">\n <teta-head-cell-host [column]=\"column\" [columns]=\"columns | async\" [data]=\"data\"></teta-head-cell-host>\n <teta-icon *ngIf=\"iconName | async as icon\"\n [palette]=\"'text'\"\n [name]=\"icon\"></teta-icon>\n </div>\n <teta-head-cell-dropdown tetaDropdownContent\n *ngIf=\"showHeadCellMenu\"\n [tabTemplates]=\"tabTemplates\"\n [data]=\"data\"\n [column]=\"column\"\n [columns]=\"columns | async\"\n [state]=\"state | async\"\n [(dropDownOpen)]=\"dropDownOpen\"></teta-head-cell-dropdown>\n </teta-dropdown>\n <div class=\"drop-area\"\n draggable=\"false\"\n [class.drop-area_left]=\"showDrag === 'left'\"\n [class.drop-area_right]=\"showDrag === 'right'\"\n *ngIf=\"showDrag\"></div>\n</div>\n<div class=\"table-head__cell__resize\"\n draggable=\"false\"\n (dragstart)=\"$event.preventDefault();$event.stopPropagation()\"\n (drag)=\"$event.preventDefault();$event.stopPropagation()\"\n [tetaResizeDrag]=\"'vertical'\"\n (resizeStart)=\"resizeStart($event)\"\n (resizeProcess)=\"resizeProcess($event)\"\n (resizeEnd)=\"resizeEnd()\">\n <div class=\"table-head__cell__resize_drag\"></div>\n</div>\n<ng-template #mainTemplate let-column=\"column\" let-columns=\"columns\" let-data=\"data\" let-state=\"state\"\n let-close=\"close\">\n <teta-main-dropdown-tab [column]=\"column\" [state]=\"state\" [close]=\"close\"></teta-main-dropdown-tab>\n</ng-template>\n<ng-template #filterTemplate let-column=\"column\" let-columns=\"columns\" let-data=\"data\" let-state=\"state\"\n let-close=\"close\">\n <teta-filter-dropdown-tab [column]=\"column\"\n [state]=\"state\"\n [close]=\"close\"\n [data]=\"data\"></teta-filter-dropdown-tab>\n</ng-template>\n<ng-template #columnsTemplate let-column=\"column\" let-columns=\"columns\" let-data=\"data\" let-state=\"state\"\n let-close=\"close\">\n <teta-visibility-dropdown-tab [column]=\"column\"\n [columns]=\"columns\"\n [state]=\"state\"\n [close]=\"close\"\n [data]=\"data\"></teta-visibility-dropdown-tab>\n</ng-template>\n", styles: [".drop-area{position:absolute;width:1px;background:var(--color-text-50);top:0;bottom:0;z-index:10}.drop-area_left{left:-1px}.drop-area_right{right:-1px}\n"] }]
9248
+ args: [{ selector: 'teta-head-cell', changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"row row_auto\">\n <teta-dropdown [autoCloseIgnore]=\"['enter', 'inside']\"\n [verticalAlign]=\"verticalAlign.bottom\"\n [appendToBody]=\"true\"\n [(open)]=\"dropDownOpen\"\n [align]=\"align.auto\"\n (click)=\"$event.preventDefault()\"\n [class.table-head__cell__menu_open]=\"dropDownOpen\"\n class=\"column column_auto justify-content-center\">\n <div tetaDropdownHead\n draggable=\"true\"\n class=\"table-head__cell__wrapper\"\n (dragstart)=\"dragstart($event)\"\n [ngClass]=\"column.headCellClass\">\n <teta-head-cell-host [column]=\"column\" [columns]=\"columns | async\" [data]=\"data\"></teta-head-cell-host>\n <teta-icon *ngIf=\"iconName | async as icon\"\n [palette]=\"'text'\"\n [name]=\"icon\"></teta-icon>\n </div>\n <teta-head-cell-dropdown tetaDropdownContent\n *ngIf=\"showHeadCellMenu\"\n [tabTemplates]=\"tabTemplates\"\n [data]=\"data\"\n [column]=\"column\"\n [columns]=\"columns | async\"\n [state]=\"state | async\"\n [(dropDownOpen)]=\"dropDownOpen\"></teta-head-cell-dropdown>\n </teta-dropdown>\n <div class=\"drop-area\"\n draggable=\"false\"\n [class.drop-area_left]=\"showDrag === 'left'\"\n [class.drop-area_right]=\"showDrag === 'right'\"\n *ngIf=\"showDrag\"></div>\n</div>\n<div class=\"table-head__cell__resize\"\n draggable=\"false\"\n (dragstart)=\"$event.preventDefault();$event.stopPropagation()\"\n (drag)=\"$event.preventDefault();$event.stopPropagation()\"\n [tetaResizeDrag]=\"'vertical'\"\n (resizeStart)=\"resizeStart($event)\"\n (resizeProcess)=\"resizeProcess($event)\"\n (resizeEnd)=\"resizeEnd()\">\n <div class=\"table-head__cell__resize_drag\"></div>\n</div>\n<ng-template #mainTemplate let-column=\"column\" let-columns=\"columns\" let-data=\"data\" let-state=\"state\"\n let-close=\"close\">\n <teta-main-dropdown-tab [column]=\"column\"\n [state]=\"state\"\n [close]=\"close\"\n [headCellElementRef]=\"elementRef\"></teta-main-dropdown-tab>\n</ng-template>\n<ng-template #filterTemplate let-column=\"column\" let-columns=\"columns\" let-data=\"data\" let-state=\"state\"\n let-close=\"close\">\n <teta-filter-dropdown-tab [column]=\"column\"\n [state]=\"state\"\n [close]=\"close\"\n [data]=\"data\"></teta-filter-dropdown-tab>\n</ng-template>\n<ng-template #columnsTemplate let-column=\"column\" let-columns=\"columns\" let-data=\"data\" let-state=\"state\"\n let-close=\"close\">\n <teta-visibility-dropdown-tab [column]=\"column\"\n [columns]=\"columns\"\n [state]=\"state\"\n [close]=\"close\"\n [data]=\"data\"></teta-visibility-dropdown-tab>\n</ng-template>\n", styles: [".drop-area{position:absolute;width:1px;background:var(--color-text-50);top:0;bottom:0;z-index:10}.drop-area_left{left:-1px}.drop-area_right{right:-1px}\n"] }]
9244
9249
  }], ctorParameters: function () { return [{ type: TableService }, { type: i0.ApplicationRef }, { type: i0.ElementRef }]; }, propDecorators: { column: [{
9245
9250
  type: Input
9246
9251
  }], showHeadCellMenu: [{