@tetacom/ng-components 1.0.6 → 1.0.7

package/fesm2020/tetacom-ng-components.mjs

@@ -1151,12 +1151,12 @@ class DropdownBase {
         }
     }
     closeDropdown() {
-        if (this._body && this.container.contains(this._body)) {
+        if (this.open && this._body && this.container.contains(this._body)) {
             this._renderer.removeChild(this.container, this._body);
+            this._open = false;
+            this._body = null;
+            this.openChange.emit(this.open);
         }
-        this._open = false;
-        this._body = null;
-        this.openChange.emit(this.open);
     }
     openDropdown() {
         if (this._open || !this._content || this.disabled) {
@@ -4122,9 +4122,8 @@ const getFilterComponent = (item) => filterComponentsMap.has(item.filterType)
     : StringFilterComponent;
 
 class FilterHostComponent {
-    constructor(viewContainerRef, componentFactoryResolver) {
+    constructor(viewContainerRef) {
         this.viewContainerRef = viewContainerRef;
-        this.componentFactoryResolver = componentFactoryResolver;
         this.filterChanged = new EventEmitter();
         this._alive = true;
     }
@@ -4153,9 +4152,8 @@ class FilterHostComponent {
         if (!FilterComponentBase.isPrototypeOf(this._column.filterComponent)) {
             this._column.filterComponent = getFilterComponent(this._column);
         }
-        const compFactory = this.componentFactoryResolver.resolveComponentFactory(this._column.filterComponent);
         this._componentRef =
-            this.viewContainerRef.createComponent(compFactory);
+            this.viewContainerRef.createComponent(this._column.filterComponent);
         this._componentRef.instance.column = this._column;
         this._componentRef.instance.state = this._state;
         this._componentRef.instance.filterOptions = this._filterOptions;
@@ -4171,7 +4169,7 @@ class FilterHostComponent {
         this._alive = false;
     }
 }
-FilterHostComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.0.1", ngImport: i0, type: FilterHostComponent, deps: [{ token: i0.ViewContainerRef }, { token: i0.ComponentFactoryResolver }], target: i0.ɵɵFactoryTarget.Component });
+FilterHostComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.0.1", ngImport: i0, type: FilterHostComponent, deps: [{ token: i0.ViewContainerRef }], target: i0.ɵɵFactoryTarget.Component });
 FilterHostComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.0.1", type: FilterHostComponent, selector: "teta-filter-host", inputs: { column: "column", state: "state", filterOptions: "filterOptions" }, outputs: { filterChanged: "filterChanged" }, ngImport: i0, template: '', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.0.1", ngImport: i0, type: FilterHostComponent, decorators: [{
             type: Component,
@@ -4181,7 +4179,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.0.1", ngImpor
                     styles: [],
                     changeDetection: ChangeDetectionStrategy.OnPush,
                 }]
-        }], ctorParameters: function () { return [{ type: i0.ViewContainerRef }, { type: i0.ComponentFactoryResolver }]; }, propDecorators: { column: [{
+        }], ctorParameters: function () { return [{ type: i0.ViewContainerRef }]; }, propDecorators: { column: [{
                 type: Input
             }], state: [{
                 type: Input
@@ -7608,9 +7606,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.0.1", ngImpor
             }] } });
 
 class HeadCellHostComponent {
-    constructor(viewContainerRef, componentFactoryResolver) {
+    constructor(viewContainerRef) {
         this.viewContainerRef = viewContainerRef;
-        this.componentFactoryResolver = componentFactoryResolver;
     }
     set column(column) {
         this._column = column;
@@ -7625,19 +7622,18 @@ class HeadCellHostComponent {
         if (!HeadCellComponentBase.isPrototypeOf(this.column.headCellComponent)) {
             this.column.headCellComponent = DefaultHeadCellComponent;
         }
-        const compFactory = this.componentFactoryResolver.resolveComponentFactory(this.column.headCellComponent);
         this.componentRef =
-            this.viewContainerRef.createComponent(compFactory);
+            this.viewContainerRef.createComponent(this.column.headCellComponent);
         this.componentRef.instance.column = this.column;
         this.init = true;
     }
 }
-HeadCellHostComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.0.1", ngImport: i0, type: HeadCellHostComponent, deps: [{ token: i0.ViewContainerRef }, { token: i0.ComponentFactoryResolver }], target: i0.ɵɵFactoryTarget.Component });
+HeadCellHostComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.0.1", ngImport: i0, type: HeadCellHostComponent, deps: [{ token: i0.ViewContainerRef }], target: i0.ɵɵFactoryTarget.Component });
 HeadCellHostComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.0.1", type: HeadCellHostComponent, selector: "teta-head-cell-host", inputs: { column: "column" }, ngImport: i0, template: '', isInline: true, styles: [":host{display:contents}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.0.1", ngImport: i0, type: HeadCellHostComponent, decorators: [{
             type: Component,
             args: [{ selector: 'teta-head-cell-host', template: '', changeDetection: ChangeDetectionStrategy.OnPush, styles: [":host{display:contents}\n"] }]
-        }], ctorParameters: function () { return [{ type: i0.ViewContainerRef }, { type: i0.ComponentFactoryResolver }]; }, propDecorators: { column: [{
+        }], ctorParameters: function () { return [{ type: i0.ViewContainerRef }]; }, propDecorators: { column: [{
                 type: Input
             }] } });
 
@@ -8678,7 +8674,7 @@ class DateCellComponent extends CellComponentBase {
         super.ngOnInit();
     }
     setValue(value) {
-        this.row.data[this.column.name] = value;
+        this.row.data[this.column.name] = value ? new Date(value) : value;
         this.valueChanged();
     }
     startEdit(initiator, type) {
@@ -8694,10 +8690,10 @@ class DateCellComponent extends CellComponentBase {
     }
 }
 DateCellComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.0.1", ngImport: i0, type: DateCellComponent, deps: [{ token: TableService }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component });
-DateCellComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.0.1", type: DateCellComponent, selector: "teta-date-cell", inputs: { column: "column", row: "row" }, viewQueries: [{ propertyName: "input", first: true, predicate: ["input"], descendants: true }], usesInheritance: true, ngImport: i0, template: "<span [style.display]=\"edit ? 'none' : 'block'\" class=\"cell-text\">\n  {{row.data[column.name] | date : 'dd.MM.yyyy'}}\n</span>\n<teta-date-picker class=\"datepicker-table\" #input\n                  *ngIf=\"edit\"\n                  [appendToBody]=\"false\"\n                  [showTime]=\"false\"\n                  [ngModel]=\"row.data[column.name]\"\n                  (ngModelChange)=\"setValue($event)\"\n></teta-date-picker>\n", styles: [""], components: [{ type: DatePickerComponent, selector: "teta-date-picker", inputs: ["disabled", "invalid", "firstDayOfWeek", "disabledDates", "disabledPeriods", "disabledDays", "minDate", "maxDate", "minYearDate", "maxYearDate", "appendToBody", "showTime", "format"] }], directives: [{ type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i3.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }], pipes: { "date": i2.DatePipe }, changeDetection: i0.ChangeDetectionStrategy.OnPush });
+DateCellComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.0.1", type: DateCellComponent, selector: "teta-date-cell", inputs: { column: "column", row: "row" }, viewQueries: [{ propertyName: "input", first: true, predicate: ["input"], descendants: true }], usesInheritance: true, ngImport: i0, template: "<span [style.display]=\"edit ? 'none' : 'block'\" class=\"cell-text\">\n  {{row.data[column.name] | date : 'dd.MM.yyyy'}}\n</span>\n<teta-date-picker class=\"datepicker-table\"\n                  #input\n                  *ngIf=\"edit\"\n                  [appendToBody]=\"false\"\n                  [showTime]=\"false\"\n                  [ngModel]=\"row.data[column.name]\"\n                  (ngModelChange)=\"setValue($event)\"\n></teta-date-picker>\n", styles: [""], components: [{ type: DatePickerComponent, selector: "teta-date-picker", inputs: ["disabled", "invalid", "firstDayOfWeek", "disabledDates", "disabledPeriods", "disabledDays", "minDate", "maxDate", "minYearDate", "maxYearDate", "appendToBody", "showTime", "format"] }], directives: [{ type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i3.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }], pipes: { "date": i2.DatePipe }, changeDetection: i0.ChangeDetectionStrategy.OnPush });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.0.1", ngImport: i0, type: DateCellComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'teta-date-cell', changeDetection: ChangeDetectionStrategy.OnPush, template: "<span [style.display]=\"edit ? 'none' : 'block'\" class=\"cell-text\">\n  {{row.data[column.name] | date : 'dd.MM.yyyy'}}\n</span>\n<teta-date-picker class=\"datepicker-table\" #input\n                  *ngIf=\"edit\"\n                  [appendToBody]=\"false\"\n                  [showTime]=\"false\"\n                  [ngModel]=\"row.data[column.name]\"\n                  (ngModelChange)=\"setValue($event)\"\n></teta-date-picker>\n", styles: [""] }]
+            args: [{ selector: 'teta-date-cell', changeDetection: ChangeDetectionStrategy.OnPush, template: "<span [style.display]=\"edit ? 'none' : 'block'\" class=\"cell-text\">\n  {{row.data[column.name] | date : 'dd.MM.yyyy'}}\n</span>\n<teta-date-picker class=\"datepicker-table\"\n                  #input\n                  *ngIf=\"edit\"\n                  [appendToBody]=\"false\"\n                  [showTime]=\"false\"\n                  [ngModel]=\"row.data[column.name]\"\n                  (ngModelChange)=\"setValue($event)\"\n></teta-date-picker>\n", styles: [""] }]
         }], ctorParameters: function () { return [{ type: TableService }, { type: i0.ChangeDetectorRef }]; }, propDecorators: { column: [{
                 type: Input
             }], row: [{
@@ -8853,17 +8849,15 @@ const getCellComponent = (column) => cellComponentsMap.has(column.filterType)
     : StringCellComponent;
 
 class CellHostComponent {
-    constructor(viewContainerRef, componentFactoryResolver) {
+    constructor(viewContainerRef) {
         this.viewContainerRef = viewContainerRef;
-        this.componentFactoryResolver = componentFactoryResolver;
         this._init = false;
     }
     ngOnInit() {
         if (!CellComponentBase.isPrototypeOf(this.column.cellComponent)) {
             this.column.cellComponent = getCellComponent(this.column);
         }
-        const compFactory = this.componentFactoryResolver.resolveComponentFactory(this.column.cellComponent);
-        this._componentRef = this.viewContainerRef.createComponent(compFactory);
+        this._componentRef = this.viewContainerRef.createComponent(this.column.cellComponent);
         this._componentRef.instance.column = this.column;
         this._componentRef.instance.row = this.row;
         this._componentRef.instance.filterOptions = this.filterOptions;
@@ -8885,12 +8879,12 @@ class CellHostComponent {
         }
     }
 }
-CellHostComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.0.1", ngImport: i0, type: CellHostComponent, deps: [{ token: i0.ViewContainerRef }, { token: i0.ComponentFactoryResolver }], target: i0.ɵɵFactoryTarget.Component });
+CellHostComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.0.1", ngImport: i0, type: CellHostComponent, deps: [{ token: i0.ViewContainerRef }], target: i0.ɵɵFactoryTarget.Component });
 CellHostComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.0.1", type: CellHostComponent, selector: "teta-cell-host", inputs: { column: "column", row: "row", filterOptions: "filterOptions", dict: "dict" }, usesOnChanges: true, ngImport: i0, template: '', isInline: true, styles: [""], changeDetection: i0.ChangeDetectionStrategy.OnPush });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.0.1", ngImport: i0, type: CellHostComponent, decorators: [{
             type: Component,
             args: [{ selector: 'teta-cell-host', template: '', changeDetection: ChangeDetectionStrategy.OnPush, styles: [""] }]
-        }], ctorParameters: function () { return [{ type: i0.ViewContainerRef }, { type: i0.ComponentFactoryResolver }]; }, propDecorators: { column: [{
+        }], ctorParameters: function () { return [{ type: i0.ViewContainerRef }]; }, propDecorators: { column: [{
                 type: Input
             }], row: [{
                 type: Input
@@ -9226,7 +9220,7 @@ class TableComponent {
                 this.startEditRowOrCell(coordinates);
             }
         }
-        if (!this.isRow(event.target)) {
+        if (!this.eventIsOnRow(event)) {
             this._svc.startEditRow(null);
         }
     }
@@ -9364,27 +9358,19 @@ class TableComponent {
             this._svc.startEditCell(coordinates);
         }
     }
-    getCell(element) {
-        if (!element.parentElement) {
-            return null;
-        }
-        if (element.tagName.toLowerCase() === 'teta-cell') {
-            return element;
-        }
-        return this.getCell(element.parentElement);
+    getEventCell(event) {
+        return event.composedPath().find((target) => {
+            return target.tagName?.toLowerCase() === 'teta-cell';
+        });
     }
-    isRow(element) {
-        if (!element.parentElement) {
-            return false;
-        }
-        if (this._elementRef.nativeElement.contains(element) &&
-            element.getAttribute('data-row')) {
-            return true;
-        }
-        return this.isRow(element.parentElement);
+    eventIsOnRow(event) {
+        const row = event.composedPath().find((target) => {
+            return target?.getAttribute && target?.getAttribute('data-row');
+        });
+        return row && this._elementRef.nativeElement.contains(row);
     }
     getCoordinates(event) {
-        const cell = this.getCell(event.target);
+        const cell = this.getEventCell(event);
         if (cell) {
             const rowIndex = cell.getAttribute('data-row');
             const columnName = cell.getAttribute('data-column');
@@ -11244,7 +11230,7 @@ class TetaChart {
     }
     drawChart() {
         const series = this._options.series?.filter((_) => _.visible);
-        this._chart.selectAll('.series').remove();
+        this._chart.selectAll('.chart-container').remove();
         if (!series || series.length < 1) {
             d3.select(this._container.nativeElement)
                 .select('canvas')