@tetacom/ng-components 1.0.137 → 1.0.138

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.
@@ -4260,7 +4260,7 @@ class ListFilterComponent extends FilterComponentBase {
4260
4260
  }
4261
4261
  get visibleOptions() {
4262
4262
  return this.filterOptions?.filter((option) => {
4263
- return option.name?.toString().indexOf(this.search) >= 0;
4263
+ return option.name?.toLowerCase().toString().indexOf(this.search?.toLowerCase()) >= 0;
4264
4264
  });
4265
4265
  }
4266
4266
  set state(val) {
@@ -8106,6 +8106,16 @@ class ContextMenuDirective extends DynamicContentBaseDirective {
8106
8106
  this._cdr = _cdr;
8107
8107
  this._click = _click;
8108
8108
  this.autoCloseIgnore = [];
8109
+ this.scrollListener = (event) => {
8110
+ if (this._open &&
8111
+ this._componentRef &&
8112
+ !this._componentRef.location.nativeElement.contains(event.target) &&
8113
+ this._componentRef.location.nativeElement !== event.target) {
8114
+ this.destroyContentRef();
8115
+ this.openChange.emit(false);
8116
+ }
8117
+ };
8118
+ this.addScrollListener();
8109
8119
  }
8110
8120
  get _dynamicContent() {
8111
8121
  return this.tetaContextMenu;
@@ -8131,29 +8141,18 @@ class ContextMenuDirective extends DynamicContentBaseDirective {
8131
8141
  this.openChange.emit(false);
8132
8142
  }
8133
8143
  }
8144
+ addScrollListener() {
8145
+ window.addEventListener('scroll', this.scrollListener, true);
8146
+ }
8147
+ removeScrollListener() {
8148
+ window.removeEventListener('scroll', this.scrollListener, true);
8149
+ }
8134
8150
  ngOnInit() {
8135
8151
  super.ngOnInit();
8136
- // merge(this._click.click, this._click.contextMenu)
8137
- // .pipe(
8138
- // takeWhile(() => this._alive),
8139
- // filter(() => this._open),
8140
- // filter(() => this._componentRef != null),
8141
- // filter(
8142
- // (event: MouseEvent) =>
8143
- // !DomUtil.clickedInside(
8144
- // this._componentRef.location.nativeElement,
8145
- // event
8146
- // ) || this.autoCloseIgnore.indexOf('inside') < 0
8147
- // ),
8148
- // tap((_) => {
8149
- // this.destroyContentRef();
8150
- // this.openChange.emit(false);
8151
- // })
8152
- // )
8153
- // .subscribe();
8154
8152
  }
8155
8153
  ngOnDestroy() {
8156
8154
  super.ngOnDestroy();
8155
+ this.removeScrollListener();
8157
8156
  }
8158
8157
  setPosition() {
8159
8158
  if (this._componentRef && this._open) {
@@ -8671,10 +8670,10 @@ class HeadCellDropdownComponent {
8671
8670
  }
8672
8671
  }
8673
8672
  HeadCellDropdownComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.0.2", ngImport: i0, type: HeadCellDropdownComponent, deps: [{ token: TableService }, { token: TetaConfigService }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component });
8674
- HeadCellDropdownComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.0.2", type: HeadCellDropdownComponent, selector: "teta-head-cell-dropdown", inputs: { columns: "columns", column: "column", state: "state", data: "data", tabTemplates: "tabTemplates", dropDownOpen: "dropDownOpen" }, outputs: { dropDownOpenChange: "dropDownOpenChange" }, ngImport: i0, template: "<teta-tabs class=\"column_auto\">\n <ng-container *ngFor=\"let tab of tabTemplates; trackBy: trackIndex\">\n <teta-tab *ngIf=\"tab.showTab(column)\">\n <ng-template tetaTabTitle>\n <ng-container *ngIf=\"tab.icon\">\n <teta-icon [name]=\"tab.icon\"></teta-icon>\n </ng-container>\n </ng-template>\n <ng-template tetaTabContent>\n <ng-container\n *ngTemplateOutlet=\"tab.template; context: {\n column: column,\n columns: columns,\n data: data,\n state: state,\n close: closeDropdown\n }\"></ng-container>\n </ng-template>\n </teta-tab>\n </ng-container>\n</teta-tabs>\n", styles: [":host{display:flex;flex-grow:1;min-height:0;min-width:250px}\n"], dependencies: [{ kind: "directive", type: i2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: IconComponent, selector: "teta-icon", inputs: ["name", "size", "palette", "class"] }, { kind: "directive", type: TabContentDirective, selector: "[tetaTabContent]" }, { kind: "directive", type: TabTitleDirective, selector: "[tetaTabTitle]" }, { kind: "component", type: TabComponent, selector: "teta-tab", inputs: ["id", "title", "disabled"] }, { kind: "component", type: TabsComponent, selector: "teta-tabs", inputs: ["activeId", "destroyOnHide"], outputs: ["tabChange"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
8673
+ HeadCellDropdownComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.0.2", type: HeadCellDropdownComponent, selector: "teta-head-cell-dropdown", inputs: { columns: "columns", column: "column", state: "state", data: "data", tabTemplates: "tabTemplates", dropDownOpen: "dropDownOpen" }, outputs: { dropDownOpenChange: "dropDownOpenChange" }, ngImport: i0, template: "<teta-tabs class=\"column_auto\" *ngIf=\"dropDownOpen\">\n <ng-container *ngFor=\"let tab of tabTemplates; trackBy: trackIndex\">\n <teta-tab *ngIf=\"tab.showTab(column)\">\n <ng-template tetaTabTitle>\n <ng-container *ngIf=\"tab.icon\">\n <teta-icon [name]=\"tab.icon\"></teta-icon>\n </ng-container>\n </ng-template>\n <ng-template tetaTabContent>\n <ng-container\n *ngTemplateOutlet=\"tab.template; context: {\n column: column,\n columns: columns,\n data: data,\n state: state,\n close: closeDropdown\n }\"></ng-container>\n </ng-template>\n </teta-tab>\n </ng-container>\n</teta-tabs>\n", styles: [":host{display:flex;flex-grow:1;min-height:0;min-width:250px}\n"], dependencies: [{ kind: "directive", type: i2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: IconComponent, selector: "teta-icon", inputs: ["name", "size", "palette", "class"] }, { kind: "directive", type: TabContentDirective, selector: "[tetaTabContent]" }, { kind: "directive", type: TabTitleDirective, selector: "[tetaTabTitle]" }, { kind: "component", type: TabComponent, selector: "teta-tab", inputs: ["id", "title", "disabled"] }, { kind: "component", type: TabsComponent, selector: "teta-tabs", inputs: ["activeId", "destroyOnHide"], outputs: ["tabChange"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
8675
8674
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.0.2", ngImport: i0, type: HeadCellDropdownComponent, decorators: [{
8676
8675
  type: Component,
8677
- args: [{ selector: 'teta-head-cell-dropdown', changeDetection: ChangeDetectionStrategy.OnPush, template: "<teta-tabs class=\"column_auto\">\n <ng-container *ngFor=\"let tab of tabTemplates; trackBy: trackIndex\">\n <teta-tab *ngIf=\"tab.showTab(column)\">\n <ng-template tetaTabTitle>\n <ng-container *ngIf=\"tab.icon\">\n <teta-icon [name]=\"tab.icon\"></teta-icon>\n </ng-container>\n </ng-template>\n <ng-template tetaTabContent>\n <ng-container\n *ngTemplateOutlet=\"tab.template; context: {\n column: column,\n columns: columns,\n data: data,\n state: state,\n close: closeDropdown\n }\"></ng-container>\n </ng-template>\n </teta-tab>\n </ng-container>\n</teta-tabs>\n", styles: [":host{display:flex;flex-grow:1;min-height:0;min-width:250px}\n"] }]
8676
+ args: [{ selector: 'teta-head-cell-dropdown', changeDetection: ChangeDetectionStrategy.OnPush, template: "<teta-tabs class=\"column_auto\" *ngIf=\"dropDownOpen\">\n <ng-container *ngFor=\"let tab of tabTemplates; trackBy: trackIndex\">\n <teta-tab *ngIf=\"tab.showTab(column)\">\n <ng-template tetaTabTitle>\n <ng-container *ngIf=\"tab.icon\">\n <teta-icon [name]=\"tab.icon\"></teta-icon>\n </ng-container>\n </ng-template>\n <ng-template tetaTabContent>\n <ng-container\n *ngTemplateOutlet=\"tab.template; context: {\n column: column,\n columns: columns,\n data: data,\n state: state,\n close: closeDropdown\n }\"></ng-container>\n </ng-template>\n </teta-tab>\n </ng-container>\n</teta-tabs>\n", styles: [":host{display:flex;flex-grow:1;min-height:0;min-width:250px}\n"] }]
8678
8677
  }], ctorParameters: function () { return [{ type: TableService }, { type: TetaConfigService }, { type: i0.ChangeDetectorRef }]; }, propDecorators: { columns: [{
8679
8678
  type: Input
8680
8679
  }], column: [{
@@ -9201,10 +9200,10 @@ class VisibilityDropdownTabComponent {
9201
9200
  }
9202
9201
  }
9203
9202
  VisibilityDropdownTabComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.0.2", ngImport: i0, type: VisibilityDropdownTabComponent, deps: [{ token: TableService }, { token: TetaConfigService }, { token: i0.ElementRef }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component });
9204
- VisibilityDropdownTabComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.0.2", type: VisibilityDropdownTabComponent, selector: "teta-visibility-dropdown-tab", inputs: { columns: "columns", column: "column", state: "state", data: "data", close: "close" }, ngImport: i0, template: "<ng-container *ngIf=\"locale | async as loc\">\n <div class=\"list-item padding-left-6 padding-top-2\" [class.padding-left-9]=\"childMode\">\n <teta-checkbox [binary]=\"true\"\n [allowNull]=\"true\"\n [ngModel]=\"allColumnsVisible()\"\n (ngModelChange)=\"setAllColumns($event)\">\n {{loc.all}}\n </teta-checkbox>\n </div>\n <div class=\"list-divider\"></div>\n <div class=\"padding-v-2 column column_auto scrollable\">\n <teta-tree [data]=\"columns\"\n [openItems]=\"openItems\"\n (openItemsChange)=\"openItems = $event\"\n [childNodeName]=\"'columns'\"\n [compareItems]=\"compareItems\">\n <ng-template tetaTemplate let-item>\n <div class=\"tree__item\" style=\"align-items: unset\">\n <teta-tree-item-toggle [item]=\"item\" *ngIf=\"item.columns?.length > 0\"></teta-tree-item-toggle>\n <teta-checkbox\n style=\"flex-grow: 1;\"\n [ngModel]=\"!columnIsHidden(item)\"\n (ngModelChange)=\"setColumnVisibility(item, $event)\"\n (click)=\"$event.stopPropagation()\"\n [binary]=\"true\"\n >\n {{item.caption}}\n </teta-checkbox>\n </div>\n </ng-template>\n </teta-tree>\n </div>\n <teta-toolbar class=\"justify-content-end\">\n <button type=\"button\"\n teta-button\n [disabled]=\"allColumnsVisible() === false\"\n [palette]=\"'primary'\"\n (click)=\"setColumnsVisibility()\">\n {{loc.apply}}\n </button>\n </teta-toolbar>\n</ng-container>\n", styles: [""], dependencies: [{ kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i3.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: CheckboxComponent, selector: "teta-checkbox", inputs: ["class", "palette", "noLabel", "disabled", "value", "binary", "allowNull"] }, { kind: "component", type: ButtonComponent, selector: "button[teta-button], teta-button", inputs: ["palette", "class", "view", "square"] }, { kind: "component", type: TreeComponent, selector: "teta-tree", inputs: ["data", "padding", "childNodeName", "virtual", "height", "openItems", "compareItems"], outputs: ["service", "openItemsChange"] }, { kind: "directive", type: TetaTemplateDirective, selector: "[tetaTemplate]", inputs: ["tetaTemplate"] }, { kind: "component", type: TreeItemToggleComponent, selector: "teta-tree-item-toggle", inputs: ["item"] }, { kind: "component", type: ToolbarComponent, selector: "teta-toolbar", inputs: ["palette", "class"] }, { kind: "pipe", type: i2.AsyncPipe, name: "async" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
9203
+ VisibilityDropdownTabComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.0.2", type: VisibilityDropdownTabComponent, selector: "teta-visibility-dropdown-tab", inputs: { columns: "columns", column: "column", state: "state", data: "data", close: "close" }, ngImport: i0, template: "<ng-container *ngIf=\"locale | async as loc\">\n <div class=\"list-item padding-left-6 padding-top-2\" [class.padding-left-9]=\"childMode\">\n <teta-checkbox [binary]=\"true\"\n [allowNull]=\"true\"\n [ngModel]=\"allColumnsVisible()\"\n (ngModelChange)=\"setAllColumns($event)\">\n {{loc.all}}\n </teta-checkbox>\n </div>\n <div class=\"list-divider\"></div>\n <div class=\"padding-v-2 column column_auto scrollable\">\n <teta-tree [data]=\"columns\"\n [openItems]=\"openItems\"\n (openItemsChange)=\"openItems = $event\"\n [childNodeName]=\"'columns'\"\n [compareItems]=\"compareItems\">\n <ng-template tetaTemplate let-item>\n <div class=\"tree__item\" style=\"align-items: unset\">\n <teta-tree-item-toggle [item]=\"item\" *ngIf=\"item.columns?.length > 0\"></teta-tree-item-toggle>\n <teta-checkbox\n style=\"flex-grow: 1;\"\n [ngModel]=\"!columnIsHidden(item)\"\n (ngModelChange)=\"setColumnVisibility(item, $event)\"\n (click)=\"$event.stopPropagation()\"\n [binary]=\"true\"\n >\n {{item.caption}}\n </teta-checkbox>\n </div>\n </ng-template>\n </teta-tree>\n </div>\n <teta-toolbar class=\"justify-content-end\">\n <button type=\"button\"\n teta-button\n [disabled]=\"allColumnsVisible() === false\"\n [palette]=\"'primary'\"\n (click)=\"setColumnsVisibility()\">\n {{loc.apply}}\n </button>\n </teta-toolbar>\n</ng-container>\n", styles: [":host{display:flex;flex-direction:column;flex-grow:1;min-height:0}\n"], dependencies: [{ kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i3.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: CheckboxComponent, selector: "teta-checkbox", inputs: ["class", "palette", "noLabel", "disabled", "value", "binary", "allowNull"] }, { kind: "component", type: ButtonComponent, selector: "button[teta-button], teta-button", inputs: ["palette", "class", "view", "square"] }, { kind: "component", type: TreeComponent, selector: "teta-tree", inputs: ["data", "padding", "childNodeName", "virtual", "height", "openItems", "compareItems"], outputs: ["service", "openItemsChange"] }, { kind: "directive", type: TetaTemplateDirective, selector: "[tetaTemplate]", inputs: ["tetaTemplate"] }, { kind: "component", type: TreeItemToggleComponent, selector: "teta-tree-item-toggle", inputs: ["item"] }, { kind: "component", type: ToolbarComponent, selector: "teta-toolbar", inputs: ["palette", "class"] }, { kind: "pipe", type: i2.AsyncPipe, name: "async" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
9205
9204
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.0.2", ngImport: i0, type: VisibilityDropdownTabComponent, decorators: [{
9206
9205
  type: Component,
9207
- args: [{ selector: 'teta-visibility-dropdown-tab', changeDetection: ChangeDetectionStrategy.OnPush, template: "<ng-container *ngIf=\"locale | async as loc\">\n <div class=\"list-item padding-left-6 padding-top-2\" [class.padding-left-9]=\"childMode\">\n <teta-checkbox [binary]=\"true\"\n [allowNull]=\"true\"\n [ngModel]=\"allColumnsVisible()\"\n (ngModelChange)=\"setAllColumns($event)\">\n {{loc.all}}\n </teta-checkbox>\n </div>\n <div class=\"list-divider\"></div>\n <div class=\"padding-v-2 column column_auto scrollable\">\n <teta-tree [data]=\"columns\"\n [openItems]=\"openItems\"\n (openItemsChange)=\"openItems = $event\"\n [childNodeName]=\"'columns'\"\n [compareItems]=\"compareItems\">\n <ng-template tetaTemplate let-item>\n <div class=\"tree__item\" style=\"align-items: unset\">\n <teta-tree-item-toggle [item]=\"item\" *ngIf=\"item.columns?.length > 0\"></teta-tree-item-toggle>\n <teta-checkbox\n style=\"flex-grow: 1;\"\n [ngModel]=\"!columnIsHidden(item)\"\n (ngModelChange)=\"setColumnVisibility(item, $event)\"\n (click)=\"$event.stopPropagation()\"\n [binary]=\"true\"\n >\n {{item.caption}}\n </teta-checkbox>\n </div>\n </ng-template>\n </teta-tree>\n </div>\n <teta-toolbar class=\"justify-content-end\">\n <button type=\"button\"\n teta-button\n [disabled]=\"allColumnsVisible() === false\"\n [palette]=\"'primary'\"\n (click)=\"setColumnsVisibility()\">\n {{loc.apply}}\n </button>\n </teta-toolbar>\n</ng-container>\n" }]
9206
+ args: [{ selector: 'teta-visibility-dropdown-tab', changeDetection: ChangeDetectionStrategy.OnPush, template: "<ng-container *ngIf=\"locale | async as loc\">\n <div class=\"list-item padding-left-6 padding-top-2\" [class.padding-left-9]=\"childMode\">\n <teta-checkbox [binary]=\"true\"\n [allowNull]=\"true\"\n [ngModel]=\"allColumnsVisible()\"\n (ngModelChange)=\"setAllColumns($event)\">\n {{loc.all}}\n </teta-checkbox>\n </div>\n <div class=\"list-divider\"></div>\n <div class=\"padding-v-2 column column_auto scrollable\">\n <teta-tree [data]=\"columns\"\n [openItems]=\"openItems\"\n (openItemsChange)=\"openItems = $event\"\n [childNodeName]=\"'columns'\"\n [compareItems]=\"compareItems\">\n <ng-template tetaTemplate let-item>\n <div class=\"tree__item\" style=\"align-items: unset\">\n <teta-tree-item-toggle [item]=\"item\" *ngIf=\"item.columns?.length > 0\"></teta-tree-item-toggle>\n <teta-checkbox\n style=\"flex-grow: 1;\"\n [ngModel]=\"!columnIsHidden(item)\"\n (ngModelChange)=\"setColumnVisibility(item, $event)\"\n (click)=\"$event.stopPropagation()\"\n [binary]=\"true\"\n >\n {{item.caption}}\n </teta-checkbox>\n </div>\n </ng-template>\n </teta-tree>\n </div>\n <teta-toolbar class=\"justify-content-end\">\n <button type=\"button\"\n teta-button\n [disabled]=\"allColumnsVisible() === false\"\n [palette]=\"'primary'\"\n (click)=\"setColumnsVisibility()\">\n {{loc.apply}}\n </button>\n </teta-toolbar>\n</ng-container>\n", styles: [":host{display:flex;flex-direction:column;flex-grow:1;min-height:0}\n"] }]
9208
9207
  }], ctorParameters: function () { return [{ type: TableService }, { type: TetaConfigService }, { type: i0.ElementRef }, { type: i0.ChangeDetectorRef }]; }, propDecorators: { columns: [{
9209
9208
  type: Input
9210
9209
  }], column: [{