@porscheinformatik/clr-addons 21.5.2 → 21.5.4

package/fesm2022/porscheinformatik-clr-addons.mjs

@@ -1,5 +1,5 @@
 import * as i0 from '@angular/core';
-import { Component, NgModule, Injectable, EventEmitter, Output, Input, Directive, ViewChild, ContentChildren, TemplateRef, ViewChildren, HostBinding, ElementRef, Renderer2, forwardRef, DOCUMENT, Inject, ContentChild, Optional, input, ChangeDetectionStrategy, signal, computed, SkipSelf, inject, model, contentChild, linkedSignal, DestroyRef, contentChildren, effect, NgZone, viewChild, HostAttributeToken, ViewContainerRef, afterRenderEffect, InjectionToken, isSignal, HostListener, LOCALE_ID, Self, Host, output, ChangeDetectorRef, Injector, untracked, runInInjectionContext } from '@angular/core';
+import { Component, NgModule, Injectable, EventEmitter, Output, Input, Directive, ViewChild, ContentChildren, TemplateRef, ViewChildren, HostBinding, ElementRef, Renderer2, forwardRef, DOCUMENT, Inject, ContentChild, Optional, input, ChangeDetectionStrategy, signal, computed, SkipSelf, inject, model, contentChild, linkedSignal, DestroyRef, contentChildren, effect, NgZone, viewChild, ViewContainerRef, afterRenderEffect, InjectionToken, isSignal, HostListener, LOCALE_ID, Self, Host, output, ChangeDetectorRef, Injector, untracked, runInInjectionContext } from '@angular/core';
 import * as i1 from '@angular/common';
 import { CommonModule, NgComponentOutlet, NgTemplateOutlet, getLocaleDateFormat, FormatWidth, NgOptimizedImage, NgClass } from '@angular/common';
 import * as i2 from '@clr/angular/icon';
@@ -5010,19 +5010,23 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.20", ngImpo
  */
 let columnId = 0;
 class ClrTreetableColumn {
-    get dataTestId() {
-        return this._userDataTestId ?? `treetable-column-${this.columnId}`;
-    }
     ngOnInit() {
         this._columnState.register({ id: this.columnId, titleTemplateRef: this._columnTitleRef() });
     }
+    ngAfterViewInit() {
+        // Only set a default testid if the consumer didn't already provide one.
+        const host = this._elementRef.nativeElement;
+        if (!host.hasAttribute('data-testid')) {
+            this._renderer.setAttribute(host, 'data-testid', `treetable-column-${this.columnId}`);
+        }
+    }
     ngOnDestroy() {
         this._columnState.unregister(this.columnId);
     }
     constructor() {
         this.columnId = `clr-tt-col-${columnId++}`;
-        /* Keep a data-testid set by the consumer, and only fall back to the default when none was provided. */
-        this._userDataTestId = inject(new HostAttributeToken('data-testid'), { optional: true });
+        this._elementRef = inject(ElementRef);
+        this._renderer = inject(Renderer2);
         this._columnTitleRef = viewChild('columnTitle', { ...(ngDevMode ? { debugName: "_columnTitleRef" } : /* istanbul ignore next */ {}), read: TemplateRef });
         this._columnState = inject(TreetableColumnStateService);
         this._sort = inject((SortStateService));
@@ -5107,7 +5111,7 @@ class ClrTreetableColumn {
         this._sort.toggle(comparator, reverse);
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.20", ngImport: i0, type: ClrTreetableColumn, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.20", type: ClrTreetableColumn, isStandalone: false, selector: "clr-tt-column", inputs: { clrTtSortBy: { classPropertyName: "clrTtSortBy", publicName: "clrTtSortBy", isSignal: true, isRequired: false, transformFunction: null }, clrTtSortOrder: { classPropertyName: "clrTtSortOrder", publicName: "clrTtSortOrder", isSignal: true, isRequired: false, transformFunction: null }, clrTtColumnSize: { classPropertyName: "clrTtColumnSize", publicName: "clrTtColumnSize", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { clrTtSortOrderChange: "clrTtSortOrderChange", clrTtColumnResize: "clrTtColumnResize" }, host: { attributes: { "role": "columnheader" }, properties: { "class.treetable-column": "true", "attr.aria-sort": "ariaSort()", "attr.data-testid": "dataTestId" } }, providers: [ClrPopoverService], viewQueries: [{ propertyName: "_columnTitleRef", first: true, predicate: ["columnTitle"], descendants: true, read: TemplateRef, isSignal: true }], ngImport: i0, template: `
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.20", type: ClrTreetableColumn, isStandalone: false, selector: "clr-tt-column", inputs: { clrTtSortBy: { classPropertyName: "clrTtSortBy", publicName: "clrTtSortBy", isSignal: true, isRequired: false, transformFunction: null }, clrTtSortOrder: { classPropertyName: "clrTtSortOrder", publicName: "clrTtSortOrder", isSignal: true, isRequired: false, transformFunction: null }, clrTtColumnSize: { classPropertyName: "clrTtColumnSize", publicName: "clrTtColumnSize", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { clrTtSortOrderChange: "clrTtSortOrderChange", clrTtColumnResize: "clrTtColumnResize" }, host: { attributes: { "role": "columnheader" }, properties: { "class.treetable-column": "true", "attr.aria-sort": "ariaSort()" } }, providers: [ClrPopoverService], viewQueries: [{ propertyName: "_columnTitleRef", first: true, predicate: ["columnTitle"], descendants: true, read: TemplateRef, isSignal: true }], ngImport: i0, template: `
     @if (isSortable()) {
       <button type="button" class="treetable-column-title" data-testId="clrTtSortButton" (click)="sort()">
         <ng-container *ngTemplateOutlet="columnTitle" />
@@ -5172,7 +5176,6 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.20", ngImpo
                     host: {
                         '[class.treetable-column]': 'true',
                         '[attr.aria-sort]': 'ariaSort()',
-                        '[attr.data-testid]': 'dataTestId',
                         role: 'columnheader',
                     },
                     changeDetection: ChangeDetectionStrategy.OnPush,
@@ -5635,16 +5638,21 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.20", ngImpo
  * This software is released under MIT license.
  * The full license information can be found in LICENSE in the root directory of this project.
  */
+const DEFAULT_TEST_ID = 'treetable-cell';
 class ClrTreetableCell {
     constructor() {
-        /* Keep a data-testid set by the consumer, and only fall back to the default when none was provided. */
-        this._userDataTestId = inject(new HostAttributeToken('data-testid'), { optional: true });
+        this._elementRef = inject(ElementRef);
+        this._renderer = inject(Renderer2);
     }
-    get dataTestId() {
-        return this._userDataTestId ?? 'treetable-cell';
+    ngAfterViewInit() {
+        // Only set a default testid if the consumer didn't already provide one.
+        const host = this._elementRef.nativeElement;
+        if (!host.hasAttribute('data-testid')) {
+            this._renderer.setAttribute(host, 'data-testid', DEFAULT_TEST_ID);
+        }
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.20", ngImport: i0, type: ClrTreetableCell, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.2.20", type: ClrTreetableCell, isStandalone: false, selector: "clr-tt-cell", host: { attributes: { "role": "gridcell" }, properties: { "class.treetable-cell": "true", "attr.data-testid": "dataTestId" } }, ngImport: i0, template: '<ng-content></ng-content>', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.2.20", type: ClrTreetableCell, isStandalone: false, selector: "clr-tt-cell", host: { attributes: { "role": "gridcell" }, properties: { "class.treetable-cell": "true" } }, ngImport: i0, template: '<ng-content></ng-content>', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.20", ngImport: i0, type: ClrTreetableCell, decorators: [{
             type: Component,
@@ -5653,7 +5661,6 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.20", ngImpo
                     template: '<ng-content></ng-content>',
                     host: {
                         '[class.treetable-cell]': 'true',
-                        '[attr.data-testid]': 'dataTestId',
                         role: 'gridcell',
                     },
                     standalone: false,
@@ -5733,6 +5740,7 @@ class TreetableHeaderRenderer {
     }
     setWidth(width) {
         const el = this.elementRef.nativeElement;
+        this.renderer.setStyle(el, 'max-width', `${width}px`);
         this.renderer.setStyle(el, 'width', `${width}px`);
         this.renderer.setStyle(el, 'flex', '0 0 auto');
     }
@@ -5776,6 +5784,7 @@ class TreetableCellRenderer {
     }
     setWidth(width) {
         const el = this.elementRef.nativeElement;
+        this.renderer.setStyle(el, 'max-width', `${width}px`);
         this.renderer.setStyle(el, 'width', `${width}px`);
         this.renderer.setStyle(el, 'flex', '0 0 auto');
     }
@@ -13189,7 +13198,9 @@ class StatePersistenceKeyDirective {
     }
     initColumnOrder(savedState) {
         if (savedState?.columns) {
-            const entries = Object.entries(savedState.columns).map(([key, value]) => [key, value.order]);
+            const entries = Object.entries(savedState.columns)
+                .filter(([, value]) => typeof value.order === 'number')
+                .map(([key, value]) => [key, value.order]);
             this.reorderDirective.initializeColumnOrder(Object.fromEntries(entries));
         }
     }