@porscheinformatik/clr-addons 19.9.12 → 19.10.0

package/fesm2022/clr-addons.mjs

@@ -1,18 +1,18 @@
 import * as i0 from '@angular/core';
-import { Component, NgModule, Injectable, EventEmitter, Input, Output, Directive, ViewChild, ContentChildren, TemplateRef, ViewChildren, HostBinding, ElementRef, Renderer2, forwardRef, Inject, ContentChild, Optional, inject, ChangeDetectorRef, output, ChangeDetectionStrategy, DestroyRef, signal, input, IterableDiffers, ViewContainerRef, effect, InjectionToken, isSignal, HostListener, LOCALE_ID, Self, computed } from '@angular/core';
+import { Component, NgModule, Injectable, EventEmitter, Output, Input, Directive, ViewChild, ContentChildren, TemplateRef, ViewChildren, HostBinding, ElementRef, Renderer2, forwardRef, Inject, ContentChild, Optional, input, ChangeDetectionStrategy, signal, computed, SkipSelf, inject, model, contentChild, linkedSignal, DestroyRef, contentChildren, effect, output, viewChild, InjectionToken, isSignal, HostListener, LOCALE_ID, Self } from '@angular/core';
 import * as i1 from '@angular/common';
-import { CommonModule, DOCUMENT, NgForOf, NgComponentOutlet, NgTemplateOutlet, getLocaleDateFormat, FormatWidth, NgClass } from '@angular/common';
-import { ClarityIcons, arrowIcon, angleIcon, timesIcon, trashIcon, plusCircleIcon, exclamationCircleIcon, searchIcon, ellipsisVerticalIcon, pencilIcon, historyIcon as historyIcon$1, treeViewIcon, organizationIcon, calendarIcon, checkCircleIcon, windowCloseIcon, exclamationTriangleIcon } from '@cds/core/icon';
+import { CommonModule, DOCUMENT, NgComponentOutlet, NgTemplateOutlet, getLocaleDateFormat, FormatWidth, NgForOf, NgClass } from '@angular/common';
+import { ClarityIcons, arrowIcon, angleIcon, timesIcon, trashIcon, plusCircleIcon, exclamationCircleIcon, searchIcon, ellipsisVerticalIcon, filterGridCircleIcon, filterGridIcon, pencilIcon, historyIcon as historyIcon$1, treeViewIcon, organizationIcon, calendarIcon, checkCircleIcon, windowCloseIcon, exclamationTriangleIcon } from '@cds/core/icon';
 import * as i2 from '@clr/angular';
-import { ClarityModule, ClrFormsModule, ClrDropdown, ClrForm, ClrAlert, ClrAxis, ClrSide, ClrAlignment, ClrPopoverToggleService, ClrPopoverEventsService, ClrPopoverPositionService, ClrIconModule, ClrDropdownModule, ClrDatagrid, ClrDatagridColumn, ClrDatagridSortOrder, DatagridPropertyComparator, ClrDatagridPagination, ClrDatagridFilter, ClrDateContainer, ClrLabel, ClrControlHelper, ClrControlError, ClrControlSuccess, ClrDatepickerModule } from '@clr/angular';
+import { ClarityModule, ClrFormsModule, ClrDropdown, ClrForm, ClrAlert, ClrAlignment, ClrSide, ClrAxis, ClrPopoverToggleService, ClrPopoverEventsService, ClrPopoverPositionService, ClrPopoverHostDirective, ClrCommonStringsService, ClrIconModule, ClrDropdownModule, ClrDatagrid, ClrDatagridColumn, ClrDatagridSortOrder, DatagridPropertyComparator, ClrDatagridPagination, ClrDatagridFilter, ClrDateContainer, ClrLabel, ClrControlHelper, ClrControlError, ClrControlSuccess, ClrDatepickerModule } from '@clr/angular';
 import * as i3$1 from '@angular/forms';
 import { FormsModule, NG_VALIDATORS, NgControl, NG_VALUE_ACCESSOR, ReactiveFormsModule, FormControl, NgModel } from '@angular/forms';
-import { Subject, BehaviorSubject, timer as timer$1, asyncScheduler, interval, debounceTime, fromEvent, of, tap, switchMap, filter as filter$1, ReplaySubject, takeUntil as takeUntil$1, delay } from 'rxjs';
-import { takeUntil, take, observeOn, debounceTime as debounceTime$1, filter as filter$2 } from 'rxjs/operators';
+import { Subject, BehaviorSubject, timer as timer$1, asyncScheduler, interval, map as map$1, distinctUntilChanged, shareReplay, combineLatest, skip, auditTime, fromEvent, take as take$1, merge, debounceTime as debounceTime$1, tap, of, switchMap, filter as filter$2, ReplaySubject, takeUntil as takeUntil$1, delay } from 'rxjs';
+import { takeUntil, take, observeOn, filter as filter$1, debounceTime } from 'rxjs/operators';
 import * as i3 from '@angular/router';
 import { RouterModule } from '@angular/router';
 import { trigger, transition, style, animate, state } from '@angular/animations';
-import { takeUntilDestroyed } from '@angular/core/rxjs-interop';
+import { takeUntilDestroyed, toObservable, outputFromObservable, toSignal } from '@angular/core/rxjs-interop';
 import * as i1$1 from '@angular/common/http';
 import '@cds/core/icon/register.js';
 import { CdkDropList, moveItemInArray } from '@angular/cdk/drag-drop';
@@ -3581,6 +3581,90 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.6", ngImpor
  * The full license information can be found in LICENSE in the root directory of this project.
  */
 
+/*
+ * Copyright (c) 2018-2025 Porsche Informatik. All Rights Reserved.
+ * This software is released under MIT license.
+ * The full license information can be found in LICENSE in the root directory of this project.
+ */
+class ClrTreetableActionOverflow {
+    constructor(smartToggleService, zone) {
+        this.smartToggleService = smartToggleService;
+        this.zone = zone;
+        this.empty = input(false);
+        this.smartPosition = {
+            axis: ClrAxis.HORIZONTAL,
+            side: ClrSide.AFTER,
+            anchor: ClrAlignment.CENTER,
+            content: ClrAlignment.CENTER,
+        };
+        this.smartToggleService.openChange.pipe(takeUntilDestroyed()).subscribe(openState => {
+            if (openState) {
+                this.focusFirstButton();
+            }
+        });
+    }
+    focusFirstButton() {
+        this.zone.runOutsideAngular(() => setTimeout(() => {
+            const firstButton = document.querySelector('button.action-item');
+            if (firstButton) {
+                firstButton.focus();
+            }
+        }));
+    }
+    closeOverflowContent(event) {
+        this.smartToggleService.toggleWithEvent(event);
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.6", ngImport: i0, type: ClrTreetableActionOverflow, deps: [{ token: i2.ClrPopoverToggleService }, { token: i0.NgZone }], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.6", type: ClrTreetableActionOverflow, isStandalone: false, selector: "clr-tt-action-overflow", inputs: { empty: { classPropertyName: "empty", publicName: "empty", isSignal: true, isRequired: false, transformFunction: null } }, host: { attributes: { "role": "cell" }, properties: { "class.treetable-row-actions": "true", "class.treetable-cell": "true" } }, providers: [ClrPopoverToggleService, ClrPopoverEventsService, ClrPopoverPositionService], ngImport: i0, template: `
+    @if (!empty()) {
+    <ng-container>
+      <button class="treetable-action-trigger" clrPopoverAnchor clrPopoverOpenCloseButton>
+        <cds-icon shape="ellipsis-vertical"></cds-icon>
+      </button>
+      <div
+        class="datagrid-action-overflow"
+        clrFocusTrap
+        (click)="closeOverflowContent($event)"
+        *clrPopoverContent="false; at: smartPosition; outsideClickToClose: true; scrollToClose: true"
+      >
+        <ng-content></ng-content>
+      </div>
+    </ng-container>
+    }
+  `, isInline: true, dependencies: [{ kind: "directive", type: i2.CdsIconCustomTag, selector: "cds-icon" }, { kind: "directive", type: i2.ClrPopoverAnchor, selector: "[clrPopoverAnchor]" }, { kind: "directive", type: i2.ÇlrClrPopoverOpenCloseButton, selector: "[clrPopoverOpenCloseButton]", outputs: ["clrPopoverOpenCloseChange"] }, { kind: "directive", type: i2.ClrPopoverContent, selector: "[clrPopoverContent]", inputs: ["clrPopoverContent", "clrPopoverContentAt", "clrPopoverContentOutsideClickToClose", "clrPopoverContentScrollToClose"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.6", ngImport: i0, type: ClrTreetableActionOverflow, decorators: [{
+            type: Component,
+            args: [{
+                    selector: 'clr-tt-action-overflow',
+                    providers: [ClrPopoverToggleService, ClrPopoverEventsService, ClrPopoverPositionService],
+                    template: `
+    @if (!empty()) {
+    <ng-container>
+      <button class="treetable-action-trigger" clrPopoverAnchor clrPopoverOpenCloseButton>
+        <cds-icon shape="ellipsis-vertical"></cds-icon>
+      </button>
+      <div
+        class="datagrid-action-overflow"
+        clrFocusTrap
+        (click)="closeOverflowContent($event)"
+        *clrPopoverContent="false; at: smartPosition; outsideClickToClose: true; scrollToClose: true"
+      >
+        <ng-content></ng-content>
+      </div>
+    </ng-container>
+    }
+  `,
+                    host: {
+                        '[class.treetable-row-actions]': 'true',
+                        '[class.treetable-cell]': 'true',
+                        role: 'cell',
+                    },
+                    standalone: false,
+                    changeDetection: ChangeDetectionStrategy.OnPush,
+                }]
+        }], ctorParameters: () => [{ type: i2.ClrPopoverToggleService }, { type: i0.NgZone }] });
+
 /*
  * Copyright (c) 2018-2025 Porsche Informatik. All Rights Reserved.
  * This software is released under MIT license.
@@ -3591,765 +3675,1074 @@ var SelectionType;
     SelectionType[SelectionType["None"] = 0] = "None";
     SelectionType[SelectionType["Multi"] = 1] = "Multi";
 })(SelectionType || (SelectionType = {}));
+var ClrTreetableSelectedState;
+(function (ClrTreetableSelectedState) {
+    ClrTreetableSelectedState[ClrTreetableSelectedState["UNSELECTED"] = 0] = "UNSELECTED";
+    ClrTreetableSelectedState[ClrTreetableSelectedState["SELECTED"] = 1] = "SELECTED";
+    ClrTreetableSelectedState[ClrTreetableSelectedState["INDETERMINATE"] = 2] = "INDETERMINATE";
+})(ClrTreetableSelectedState || (ClrTreetableSelectedState = {}));
 
 /*
  * Copyright (c) 2018-2025 Porsche Informatik. All Rights Reserved.
  * This software is released under MIT license.
  * The full license information can be found in LICENSE in the root directory of this project.
  */
-class Sort {
+class ClrTreetableRecursionService {
+    constructor() {
+        this._template = signal(null);
+        this.recursionTemplate = computed(() => this._template());
+        this.isRecursionMode = computed(() => !!this._template());
+    }
+    setTemplate(newTemplate) {
+        this._template.set(newTemplate);
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.6", ngImport: i0, type: ClrTreetableRecursionService, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
+    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "19.2.6", ngImport: i0, type: ClrTreetableRecursionService }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.6", ngImport: i0, type: ClrTreetableRecursionService, decorators: [{
+            type: Injectable
+        }] });
+function treetableRecursionServiceFactory(existing) {
+    return existing || new ClrTreetableRecursionService();
+}
+const TREETABLE_RECURSION_SERVICE_PROVIDER = {
+    provide: ClrTreetableRecursionService,
+    useFactory: treetableRecursionServiceFactory,
+    deps: [[new Optional(), new SkipSelf(), ClrTreetableRecursionService]],
+};
+
+/*
+ * Copyright (c) 2018-2025 Porsche Informatik. All Rights Reserved.
+ * This software is released under MIT license.
+ * The full license information can be found in LICENSE in the root directory of this project.
+ */
+class ClrTreetableRecursiveRows {
+    constructor() {
+        this._recursionService = inject((ClrTreetableRecursionService));
+        this.parent = input(null);
+        this.children = input([]);
+        this.template = computed(() => this._recursionService.recursionTemplate());
+    }
+    getContext(node) {
+        return { $implicit: node.value, isLeaf: node.isLeaf, clrTtNode: node };
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.6", ngImport: i0, type: ClrTreetableRecursiveRows, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.6", type: ClrTreetableRecursiveRows, isStandalone: false, selector: "clr-tt-recursive-rows", inputs: { parent: { classPropertyName: "parent", publicName: "parent", isSignal: true, isRequired: false, transformFunction: null }, children: { classPropertyName: "children", publicName: "children", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "attr.role": "\"group\"" } }, ngImport: i0, template: `
+    <ng-container>
+      @for (child of parent()?.children || children(); track child.id) {
+      <ng-container *ngTemplateOutlet="template(); context: getContext(child)" />
+      }
+    </ng-container>
+  `, isInline: true, dependencies: [{ kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.6", ngImport: i0, type: ClrTreetableRecursiveRows, decorators: [{
+            type: Component,
+            args: [{
+                    selector: 'clr-tt-recursive-rows',
+                    template: `
+    <ng-container>
+      @for (child of parent()?.children || children(); track child.id) {
+      <ng-container *ngTemplateOutlet="template(); context: getContext(child)" />
+      }
+    </ng-container>
+  `,
+                    host: {
+                        '[attr.role]': '"group"',
+                    },
+                    changeDetection: ChangeDetectionStrategy.OnPush,
+                    standalone: false,
+                }]
+        }] });
+
+/*
+ * Copyright (c) 2018-2025 Porsche Informatik. All Rights Reserved.
+ * This software is released under MIT license.
+ * The full license information can be found in LICENSE in the root directory of this project.
+ */
+class ClrTreetableRowCheckbox {
+    constructor() {
+        this.clrTtSelectionState = model(ClrTreetableSelectedState.UNSELECTED);
+        this.isSelected = computed(() => this.clrTtSelectionState() === ClrTreetableSelectedState.SELECTED);
+        this.isIndeterminate = computed(() => this.clrTtSelectionState() === ClrTreetableSelectedState.INDETERMINATE);
+    }
+    toggle() {
+        this.clrTtSelectionState.update(current => current === ClrTreetableSelectedState.SELECTED
+            ? ClrTreetableSelectedState.UNSELECTED
+            : ClrTreetableSelectedState.SELECTED);
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.6", ngImport: i0, type: ClrTreetableRowCheckbox, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "19.2.6", type: ClrTreetableRowCheckbox, isStandalone: false, selector: "clr-tt-row-checkbox", inputs: { clrTtSelectionState: { classPropertyName: "clrTtSelectionState", publicName: "clrTtSelectionState", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { clrTtSelectionState: "clrTtSelectionStateChange" }, ngImport: i0, template: `
+    <div class="clr-checkbox-wrapper treetable-row-selection treetable-cell">
+      <input
+        type="checkbox"
+        data-testId="clrTtRowCheckbox"
+        [indeterminate]="isIndeterminate()"
+        [checked]="isSelected()"
+        (change)="toggle()"
+      />
+    </div>
+  `, isInline: true, styles: [".treetable-children-container{opacity:0;will-change:height,opacity}.treetable-children-container.expanded{opacity:1}.treetable-children-container.collapsed{height:0;opacity:0;overflow:hidden}.treetable-children-container.animate{transition:height .4s ease,opacity .4s ease}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.6", ngImport: i0, type: ClrTreetableRowCheckbox, decorators: [{
+            type: Component,
+            args: [{ selector: 'clr-tt-row-checkbox', template: `
+    <div class="clr-checkbox-wrapper treetable-row-selection treetable-cell">
+      <input
+        type="checkbox"
+        data-testId="clrTtRowCheckbox"
+        [indeterminate]="isIndeterminate()"
+        [checked]="isSelected()"
+        (change)="toggle()"
+      />
+    </div>
+  `, changeDetection: ChangeDetectionStrategy.OnPush, standalone: false, styles: [".treetable-children-container{opacity:0;will-change:height,opacity}.treetable-children-container.expanded{opacity:1}.treetable-children-container.collapsed{height:0;opacity:0;overflow:hidden}.treetable-children-container.animate{transition:height .4s ease,opacity .4s ease}\n"] }]
+        }] });
+
+/*
+ * Copyright (c) 2018-2025 Porsche Informatik. All Rights Reserved.
+ * This software is released under MIT license.
+ * The full license information can be found in LICENSE in the root directory of this project.
+ */
+class ClrTreetableRow {
     constructor() {
-        this._reverse = false;
-        this._change = new Subject();
+        this._recursionService = inject(ClrTreetableRecursionService);
+        this._treetable = inject(ClrTreetable);
+        this.clrExpanded = model(false);
+        this.clrExpandable = input(false);
+        this.clrClickable = input(true);
+        this.clrTtItem = input(undefined);
+        this._actionOverflow = contentChild(ClrTreetableActionOverflow);
+        this.shouldAnimate = signal(false);
+        this.isRecursionMode = this._recursionService.isRecursionMode;
+        this._isClickable = computed(() => this._treetable.clrClickableRows() && this.clrClickable());
+        this.isSelected = computed(() => this.clrTtItem()?.selected() === ClrTreetableSelectedState.SELECTED);
+        this.showActionOverflow = computed(() => this._treetable.hasActionOverflow() || !!this._actionOverflow());
+        this.showEmptyActionOverflow = computed(() => !this._actionOverflow());
+        this.showClickClass = computed(() => this._treetable.clrClickableRows() && this.clrExpandable());
+        this.showSelection = computed(() => this._treetable.selectionType() === SelectionType.Multi);
+    }
+    onExpandCollapseClick() {
+        // Only animate on user click (not on sorting or initial rendering)
+        this.shouldAnimate.set(true);
+        this.toggleExpand();
+        // Remove .animate after animation to prevent unwanted transitions
+        setTimeout(() => {
+            this.shouldAnimate.set(false);
+        }, 350);
     }
-    get comparator() {
-        return this._comparator;
+    toggleSelection(selectionState) {
+        this.clrTtItem()?.setSelected(selectionState);
     }
-    set comparator(value) {
-        this._comparator = value;
-        this.emitChange();
+    toggleExpand() {
+        if (this.clrExpandable()) {
+            this.clrExpanded.update(state => !state);
+        }
     }
-    get reverse() {
-        return this._reverse;
+    onRowClick(event) {
+        if (this._isClickable() && !event.target.closest('.treetable-action-trigger')) {
+            this.onExpandCollapseClick();
+        }
     }
-    set reverse(value) {
-        this._reverse = value;
-        this.emitChange();
+    onCaretClick() {
+        if (!this._isClickable()) {
+            this.onExpandCollapseClick();
+        }
     }
-    // We do not want to expose the Subject itself, but the Observable which is read-only
-    get change() {
-        return this._change.asObservable();
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.6", ngImport: i0, type: ClrTreetableRow, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.6", type: ClrTreetableRow, isStandalone: false, selector: "clr-tt-row", inputs: { clrExpanded: { classPropertyName: "clrExpanded", publicName: "clrExpanded", isSignal: true, isRequired: false, transformFunction: null }, clrExpandable: { classPropertyName: "clrExpandable", publicName: "clrExpandable", isSignal: true, isRequired: false, transformFunction: null }, clrClickable: { classPropertyName: "clrClickable", publicName: "clrClickable", isSignal: true, isRequired: false, transformFunction: null }, clrTtItem: { classPropertyName: "clrTtItem", publicName: "clrTtItem", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { clrExpanded: "clrExpandedChange" }, host: { properties: { "class.treetable-row-wrapper": "true", "class.treetable-selected": "isSelected()" } }, providers: [TREETABLE_RECURSION_SERVICE_PROVIDER], queries: [{ propertyName: "_actionOverflow", first: true, predicate: ClrTreetableActionOverflow, descendants: true, isSignal: true }], ngImport: i0, template: "<!--\n  ~ Copyright (c) 2018-2025 Porsche Informatik. All Rights Reserved.\n  ~ This software is released under MIT license.\n  ~ The full license information can be found in LICENSE in the root directory of this project.\n  -->\n\n<div\n  class=\"clr-tt-node-content treetable-row\"\n  [class.clr-row-clickable]=\"showClickClass()\"\n  [class.treetable-selected]=\"isSelected()\"\n  (click)=\"onRowClick($event)\"\n>\n  @if (showSelection()) {\n  <clr-tt-row-checkbox\n    [clrTtSelectionState]=\"clrTtItem().selected()\"\n    (clrTtSelectionStateChange)=\"toggleSelection($event)\"\n    (click)=\"$event.stopPropagation()\"\n  >\n  </clr-tt-row-checkbox>\n  }\n\n  <ng-content select=\"clr-tt-action-overflow\" />\n\n  @if (showActionOverflow() && showEmptyActionOverflow()) {\n  <clr-tt-action-overflow [empty]=\"true\" />\n  }\n\n  <div class=\"treetable-scrolling-cells\">\n    @if (clrExpandable()) {\n    <div class=\"treetable-expandable-caret\">\n      <button\n        type=\"button\"\n        class=\"treetable-expandable-caret-button\"\n        data-testId=\"clrTtRowCaret\"\n        (click)=\"onCaretClick()\"\n      >\n        <cds-icon\n          shape=\"angle\"\n          [attr.direction]=\"clrExpanded() ? 'down' : 'right'\"\n          class=\"treetable-expandable-caret-icon\"\n        ></cds-icon>\n      </button>\n    </div>\n    }\n\n    <ng-content select=\"clr-tt-cell\" />\n  </div>\n</div>\n\n<div\n  class=\"treetable-children-container\"\n  data-testId=\"clrTtRowChildContainer\"\n  [class.expanded]=\"clrExpanded()\"\n  [class.collapsed]=\"!clrExpanded()\"\n  [class.animate]=\"shouldAnimate()\"\n>\n  @if (isRecursionMode()) {\n  <clr-tt-recursive-rows [parent]=\"clrTtItem()\" />\n  } @else {\n  <ng-content select=\"clr-tt-row\" />\n  }\n</div>\n", styles: [".treetable-children-container{opacity:0;will-change:height,opacity}.treetable-children-container.expanded{opacity:1}.treetable-children-container.collapsed{height:0;opacity:0;overflow:hidden}.treetable-children-container.animate{transition:height .4s ease,opacity .4s ease}\n"], dependencies: [{ kind: "directive", type: i2.CdsIconCustomTag, selector: "cds-icon" }, { kind: "component", type: ClrTreetableActionOverflow, selector: "clr-tt-action-overflow", inputs: ["empty"] }, { kind: "component", type: ClrTreetableRecursiveRows, selector: "clr-tt-recursive-rows", inputs: ["parent", "children"] }, { kind: "component", type: ClrTreetableRowCheckbox, selector: "clr-tt-row-checkbox", inputs: ["clrTtSelectionState"], outputs: ["clrTtSelectionStateChange"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.6", ngImport: i0, type: ClrTreetableRow, decorators: [{
+            type: Component,
+            args: [{ selector: 'clr-tt-row', providers: [TREETABLE_RECURSION_SERVICE_PROVIDER], host: { '[class.treetable-row-wrapper]': 'true', '[class.treetable-selected]': 'isSelected()' }, changeDetection: ChangeDetectionStrategy.OnPush, standalone: false, template: "<!--\n  ~ Copyright (c) 2018-2025 Porsche Informatik. All Rights Reserved.\n  ~ This software is released under MIT license.\n  ~ The full license information can be found in LICENSE in the root directory of this project.\n  -->\n\n<div\n  class=\"clr-tt-node-content treetable-row\"\n  [class.clr-row-clickable]=\"showClickClass()\"\n  [class.treetable-selected]=\"isSelected()\"\n  (click)=\"onRowClick($event)\"\n>\n  @if (showSelection()) {\n  <clr-tt-row-checkbox\n    [clrTtSelectionState]=\"clrTtItem().selected()\"\n    (clrTtSelectionStateChange)=\"toggleSelection($event)\"\n    (click)=\"$event.stopPropagation()\"\n  >\n  </clr-tt-row-checkbox>\n  }\n\n  <ng-content select=\"clr-tt-action-overflow\" />\n\n  @if (showActionOverflow() && showEmptyActionOverflow()) {\n  <clr-tt-action-overflow [empty]=\"true\" />\n  }\n\n  <div class=\"treetable-scrolling-cells\">\n    @if (clrExpandable()) {\n    <div class=\"treetable-expandable-caret\">\n      <button\n        type=\"button\"\n        class=\"treetable-expandable-caret-button\"\n        data-testId=\"clrTtRowCaret\"\n        (click)=\"onCaretClick()\"\n      >\n        <cds-icon\n          shape=\"angle\"\n          [attr.direction]=\"clrExpanded() ? 'down' : 'right'\"\n          class=\"treetable-expandable-caret-icon\"\n        ></cds-icon>\n      </button>\n    </div>\n    }\n\n    <ng-content select=\"clr-tt-cell\" />\n  </div>\n</div>\n\n<div\n  class=\"treetable-children-container\"\n  data-testId=\"clrTtRowChildContainer\"\n  [class.expanded]=\"clrExpanded()\"\n  [class.collapsed]=\"!clrExpanded()\"\n  [class.animate]=\"shouldAnimate()\"\n>\n  @if (isRecursionMode()) {\n  <clr-tt-recursive-rows [parent]=\"clrTtItem()\" />\n  } @else {\n  <ng-content select=\"clr-tt-row\" />\n  }\n</div>\n", styles: [".treetable-children-container{opacity:0;will-change:height,opacity}.treetable-children-container.expanded{opacity:1}.treetable-children-container.collapsed{height:0;opacity:0;overflow:hidden}.treetable-children-container.animate{transition:height .4s ease,opacity .4s ease}\n"] }]
+        }] });
+
+/*
+ * Copyright (c) 2018-2025 Porsche Informatik. All Rights Reserved.
+ * This software is released under MIT license.
+ * The full license information can be found in LICENSE in the root directory of this project.
+ */
+class Sort {
+    constructor() {
+        this._comparator = signal(null);
+        this._reverse = signal(false);
+        this.sortState = computed(() => ({
+            comparator: this._comparator(),
+            reverse: this._reverse(),
+        }));
+        this.changes$ = toObservable(this.sortState);
     }
     /**
      * Sets a comparator as the current one, or toggles reverse if the comparator is already used. The
      * optional forceReverse input parameter allows to override that toggling behavior by sorting in
      * reverse order if `true`.
-     *
-     * @memberof Sort
      */
     toggle(sortBy, forceReverse) {
-        if (this.comparator === sortBy) {
-            this._reverse = typeof forceReverse !== 'undefined' ? forceReverse || !this._reverse : !this._reverse;
+        if (this._comparator() === sortBy) {
+            const newReverse = typeof forceReverse !== 'undefined' ? forceReverse : !this._reverse();
+            this._reverse.set(newReverse);
         }
         else {
-            this._comparator = sortBy;
-            this._reverse = typeof forceReverse !== 'undefined' ? forceReverse : false;
+            this._comparator.set(sortBy);
+            this._reverse.set(typeof forceReverse !== 'undefined' ? forceReverse : false);
         }
-        this.emitChange();
     }
+    /**
+     * Clears the current comparator
+     */
     clear() {
-        this.comparator = null;
+        this._comparator.set(null);
     }
+    /**
+     * Compares two items using the current comparator and reverse flag
+     */
     compare(a, b) {
-        return (this.reverse ? -1 : 1) * this.comparator.compare(a, b);
-    }
-    emitChange() {
-        this._change.next(this);
+        const currentComparator = this._comparator();
+        if (!currentComparator) {
+            return 0;
+        }
+        return (this._reverse() ? -1 : 1) * currentComparator.compare(a, b);
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.6", ngImport: i0, type: Sort, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
     static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "19.2.6", ngImport: i0, type: Sort }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.6", ngImport: i0, type: Sort, decorators: [{
             type: Injectable
-        }], ctorParameters: () => [] });
+        }] });
 
 /*
  * Copyright (c) 2018-2025 Porsche Informatik. All Rights Reserved.
  * This software is released under MIT license.
  * The full license information can be found in LICENSE in the root directory of this project.
  */
-class Items {
-    constructor() {
-        this._all = [];
-        this._displayed = [];
-        this._change = new Subject();
-        this._sort = inject((Sort));
-        this._sort.change.pipe(takeUntilDestroyed()).subscribe(() => {
-            this.sortItems();
+/**
+ * Internal counter for generating unique node ids.
+ */
+let treeNodeIdCounter = 0;
+/**
+ * Creates a unique id for a tree node instance.
+ */
+function uniqueTreeNodeIdFactory() {
+    return `clr-treetable-node-${treeNodeIdCounter++}`;
+}
+/**
+ * Represents a single tree node inside the treetable.
+ * Maintains derived selection state (SELECTED / UNSELECTED / INDETERMINATE) based on:
+ *  - Manual selection of this node.
+ *  - Aggregated selection states of all descendants.
+ * Selection propagation to descendants happens only on explicit setSelected calls.
+ */
+class ClrTreetableTreeNode {
+    constructor(value, parent = null, children = [], stickyIndeterminate = false) {
+        this.id = uniqueTreeNodeIdFactory();
+        this.parent = null;
+        this.children = [];
+        this.manuallySelected = signal(false);
+        this.selected = linkedSignal(() => {
+            const isManuallySelected = this.manuallySelected();
+            let allChildrenSelected = true;
+            let anyChildSelected = false;
+            for (const child of this.children) {
+                switch (child.selected()) {
+                    case ClrTreetableSelectedState.SELECTED:
+                        anyChildSelected = true;
+                        break;
+                    case ClrTreetableSelectedState.INDETERMINATE:
+                        anyChildSelected = true;
+                        allChildrenSelected = false;
+                        break;
+                    case ClrTreetableSelectedState.UNSELECTED:
+                    default:
+                        allChildrenSelected = false;
+                        break;
+                }
+                if (!allChildrenSelected && anyChildSelected) {
+                    break;
+                }
+            }
+            if (isManuallySelected && allChildrenSelected) {
+                return ClrTreetableSelectedState.SELECTED;
+            }
+            if (this.isLeaf) {
+                return ClrTreetableSelectedState.UNSELECTED;
+            }
+            if (!anyChildSelected) {
+                return ClrTreetableSelectedState.UNSELECTED;
+            }
+            if (allChildrenSelected && !this.stickyIndeterminate) {
+                return ClrTreetableSelectedState.SELECTED;
+            }
+            return ClrTreetableSelectedState.INDETERMINATE;
         });
-    }
-    get all() {
-        return this._all;
-    }
-    addItems(items) {
-        this._all = this._all.concat([items.slice()]);
-        this._displayed = this._displayed.concat([items.slice()]);
-        this.emitChange();
-    }
-    get displayed() {
-        return this._displayed;
-    }
-    get change() {
-        return this._change.asObservable();
+        this.value = value;
+        this.parent = parent;
+        this.children = children;
+        this.stickyIndeterminate = stickyIndeterminate;
     }
     /**
-     * Checks if we don't have data to process yet, to abort early operations
+     * Depth level in the tree (root = 0).
      */
-    get uninitialized() {
-        return !this._all;
+    get depth() {
+        return this.parent ? this.parent.depth + 1 : 0;
     }
-    emitChange() {
-        this._change.next(this.displayed);
+    /**
+     * True if this node has no children.
+     */
+    get isLeaf() {
+        return this.children?.length === 0;
     }
-    sortItems() {
-        if (this.uninitialized) {
-            return;
+    /**
+     * Sets the selection state for this node and propagates to all descendants (except INDETERMINATE).
+     * @param state Desired selection state.
+     */
+    setSelected(state) {
+        switch (state) {
+            case ClrTreetableSelectedState.SELECTED:
+                if (!this.manuallySelected()) {
+                    this.manuallySelected.set(true);
+                }
+                this.propagateToChildren(true);
+                break;
+            case ClrTreetableSelectedState.UNSELECTED:
+                if (this.manuallySelected()) {
+                    this.manuallySelected.set(false);
+                }
+                this.propagateToChildren(false);
+                break;
+            case ClrTreetableSelectedState.INDETERMINATE:
+                break;
         }
-        if (this._sort.comparator) {
-            this._displayed.forEach(subArray => {
-                subArray.sort((a, b) => this._sort.compare(a, b));
-            });
+    }
+    /**
+     * Returns all descendants as a flat generator.
+     */
+    *getFlatDescendants() {
+        for (const child of this.children) {
+            yield child;
+            if (!child.isLeaf) {
+                yield* child.getFlatDescendants();
+            }
         }
-        else {
-            this._displayed = this._all.map(subArray => subArray.slice());
+    }
+    /**
+     * Recursively applies a selected/unselected state to all descendants.
+     */
+    propagateToChildren(selected) {
+        for (const child of this.children) {
+            child.setSelected(selected ? ClrTreetableSelectedState.SELECTED : ClrTreetableSelectedState.UNSELECTED);
+            if (!child.isLeaf) {
+                child.propagateToChildren(selected);
+            }
         }
-        this.emitChange();
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.6", ngImport: i0, type: Items, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
-    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "19.2.6", ngImport: i0, type: Items }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.6", ngImport: i0, type: Items, decorators: [{
-            type: Injectable
-        }], ctorParameters: () => [] });
+/**
+ * Internal recursive helper building the internal tree node structure.
+ */
+function mapToInternalTreeRecursive(value, getChildren, parent, stickyIndeterminate) {
+    const node = new ClrTreetableTreeNode(value, parent, [], stickyIndeterminate);
+    const rawChildren = getChildren(value) || [];
+    node.children = rawChildren.map(child => mapToInternalTreeRecursive(child, getChildren, node, stickyIndeterminate));
+    return node;
+}
+/**
+ * Creates an internal tree node hierarchy from a raw data object.
+ *
+ * @param value Root raw data object.
+ * @param getChildren Function returning direct children of a node.
+ * @param stickyIndeterminate Whether to keep INDETERMINATE even if all descendants become selected.
+ */
+function mapToInternalTree(value, getChildren, stickyIndeterminate) {
+    return mapToInternalTreeRecursive(value, getChildren, null, stickyIndeterminate);
+}
 
 /*
  * Copyright (c) 2018-2025 Porsche Informatik. All Rights Reserved.
  * This software is released under MIT license.
  * The full license information can be found in LICENSE in the root directory of this project.
  */
-class Selection {
-    constructor() {
-        this._change = new Subject();
-        this._allSelected = new Subject();
-        //debounce and batch changes before emitting them to subscribers
-        this._valueCollector = new Subject();
-        this._selectionType = SelectionType.None;
-        this._items = inject(Items);
-        this._valueCollector.pipe(debounceTime(0), takeUntilDestroyed()).subscribe(() => this.emitChange());
-    }
-    get selectionType() {
-        return this._selectionType;
-    }
-    set selectionType(value) {
-        if (value === this.selectionType) {
-            return;
-        }
-        this._selectionType = value;
-        if (value === SelectionType.None) {
-            delete this.current;
-        }
-        else {
-            this.updateCurrent([], false);
-        }
-    }
-    get current() {
-        return this._current;
-    }
-    set current(value) {
-        this.updateCurrent(value, true);
+/**
+ * Helper function to check if a primitive filter value is valid. Complex objects will always be valid.
+ * This function is a fallback for primitive values, if a custom filter does not set the isActive method correctly.
+ *
+ * @param value the value to check
+ */
+function isValidFilterValue(value) {
+    if (value == null || value === false) {
+        return false;
     }
-    updateCurrent(value, emit) {
-        this._current = value;
-        if (emit) {
-            this._valueCollector.next(value);
-        }
+    if (typeof value === 'string') {
+        return value.trim().length > 0;
     }
-    get change() {
-        return this._change.asObservable();
+    if (typeof value === 'number') {
+        return !Number.isNaN(value);
     }
-    get allSelectedChange() {
-        return this._allSelected.asObservable();
+    return true;
+}
+/**
+ * Comparator for distinctUntilChanged on the filter values stream.
+ * Emits only when:
+ *  - Array length changes, or
+ *  - A primitive value at some index changes, or
+ *  - Any element is non-primitive (object / function / array) -> always treated as changed.
+ *
+ * Rationale:
+ * Objects/arrays are assumed to have unstable identity/content; any occurrence triggers a new emission.
+ *
+ * @param prev Previous emitted array of active filter values.
+ * @param curr Current emitted array of active filter values.
+ * @returns true if both arrays should be considered equal (no new emission), false otherwise.
+ */
+function areFiltersDistinct(prev, curr) {
+    if (prev === curr) {
+        return true;
     }
-    isSelected(item) {
-        return this.current.indexOf(item) >= 0;
+    if (!Array.isArray(prev) || !Array.isArray(curr)) {
+        return false;
     }
-    setSelected(item, selected) {
-        const index = this.current ? this.current.indexOf(item) : -1;
-        if (index >= 0 && !selected) {
-            this.deselectItem(index);
-        }
-        else if (index < 0 && selected) {
-            this.selectItem(item);
-        }
+    if (prev.length !== curr.length) {
+        return false;
     }
-    isAllSelected() {
-        const displayedItems = this._items.displayed;
-        const nbDisplayed = displayedItems.length;
-        if (nbDisplayed < 1) {
+    const isPrimitive = (v) => v == null || (typeof v !== 'object' && typeof v !== 'function');
+    for (let i = 0; i < prev.length; i++) {
+        const a = prev[i];
+        const b = curr[i];
+        // Non-primitive anywhere => force emission
+        if (!isPrimitive(a) || !isPrimitive(b)) {
             return false;
         }
-        const flattenedDisplayedItems = displayedItems.flat();
-        const selectedItems = flattenedDisplayedItems.filter(item => this.current.indexOf(item) > -1);
-        return selectedItems.length === flattenedDisplayedItems.length;
-    }
-    toggleAll() {
-        const isAllSelected = this.isAllSelected();
-        if (isAllSelected) {
-            this._items.displayed.forEach(items => {
-                items.forEach(item => {
-                    const currentIndex = this.current.indexOf(item);
-                    if (currentIndex > -1) {
-                        this.deselectItem(currentIndex);
-                    }
-                });
-            });
-        }
-        else {
-            this._items.displayed.forEach(items => {
-                items.forEach(item => {
-                    if (this.current.indexOf(item) < 0) {
-                        this.selectItem(item);
-                    }
-                });
-            });
+        if (!Object.is(a, b)) {
+            return false;
         }
-        this._allSelected.next(!isAllSelected);
     }
-    selectItem(item) {
-        this.current = this.current.concat(item);
-    }
-    deselectItem(indexOfItem) {
-        this.current = this.current.slice(0, indexOfItem).concat(this.current.slice(indexOfItem + 1));
-    }
-    emitChange() {
-        this._change.next(this.current);
-    }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.6", ngImport: i0, type: Selection, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
-    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "19.2.6", ngImport: i0, type: Selection }); }
+    return true;
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.6", ngImport: i0, type: Selection, decorators: [{
-            type: Injectable
-        }], ctorParameters: () => [] });
 
 /*
  * Copyright (c) 2018-2025 Porsche Informatik. All Rights Reserved.
  * This software is released under MIT license.
  * The full license information can be found in LICENSE in the root directory of this project.
  */
-var ClrTreetableSortOrder;
-(function (ClrTreetableSortOrder) {
-    ClrTreetableSortOrder[ClrTreetableSortOrder["UNSORTED"] = 0] = "UNSORTED";
-    ClrTreetableSortOrder[ClrTreetableSortOrder["ASC"] = 1] = "ASC";
-    ClrTreetableSortOrder[ClrTreetableSortOrder["DESC"] = -1] = "DESC";
-})(ClrTreetableSortOrder || (ClrTreetableSortOrder = {}));
-
-/*
- * Copyright (c) 2018-2025 Porsche Informatik. All Rights Reserved.
- * This software is released under MIT license.
- * The full license information can be found in LICENSE in the root directory of this project.
+/**
+ * Wrapper for a treetable filter instance that holds the filter and its unregister callback.
+ *
+ * @template T The row data type processed by the treetable.
+ * @template F The concrete filter type implementing <code>ClrTreetableFilterInterface</code> for <code>T</code>.
+ * @property filter The concrete filter instance.
+ * @property unregister Callback to remove this filter from the Filters service.
  */
-class ClrTreetableColumn {
-    get sortBy() {
-        return this._sortBy;
-    }
-    set sortBy(comparator) {
-        this._sortBy = comparator;
-    }
-    get sortOrder() {
-        return this._sortOrder;
-    }
-    set sortOrder(value) {
-        if (typeof value === 'undefined') {
-            return;
-        }
-        // nothing to do when incoming sort order is the same
-        if (this._sortOrder === value) {
-            return;
-        }
-        switch (value) {
-            case ClrTreetableSortOrder.ASC:
-                this.sort(false);
-                break;
-            case ClrTreetableSortOrder.DESC:
-                this.sort(true);
-                break;
-            // UNSORTED when neither ASC or DESC
-            case ClrTreetableSortOrder.UNSORTED:
-            default:
-                this._sort.clear();
-                break;
-        }
-    }
-    get sortDirection() {
-        return this._sortDirection;
+class RegisteredTreetableFilter {
+    constructor(filter, unregister) {
+        this.filter = filter;
+        this.unregister = unregister;
     }
+}
+class Filters {
     constructor() {
-        this._sort = inject((Sort));
-        this._cdr = inject(ChangeDetectorRef);
-        this._sortOrder = ClrTreetableSortOrder.UNSORTED;
-        this.sortOrderChange = output({ alias: 'clrTtSortOrderChange' });
-        this.listenForSortingChanges();
-    }
-    get ariaSort() {
-        switch (this._sortOrder) {
-            case ClrTreetableSortOrder.ASC:
-                return 'ascending';
-            case ClrTreetableSortOrder.DESC:
-                return 'descending';
-            case ClrTreetableSortOrder.UNSORTED:
-            default:
-                return 'none';
-        }
-    }
-    get sortable() {
-        return !!this._sortBy;
+        this._destroyRef = inject(DestroyRef);
+        this.filterId = 0;
+        this.updateFilterValue$ = new Subject();
+        this._filterState = signal({});
+        this._registeredFilters = computed(() => {
+            const filterStates = Object.values(this._filterState());
+            return filterStates.map(({ filter }) => filter);
+        });
+        this.activeFilters = computed(() => {
+            return this._registeredFilters()
+                .filter(({ filter }) => filter.isActive())
+                .map(({ filter }) => filter);
+        });
+        this.hasActiveFilters = computed(() => this.activeFilters().length > 0);
+        this.changes$ = toObservable(this._filterState).pipe(map$1(filterState => Object.values(filterState)
+            .filter(({ filter }) => filter.filter.isActive())
+            .map(({ value }) => value)
+            .filter(value => isValidFilterValue(value))), distinctUntilChanged(areFiltersDistinct), shareReplay(1));
+        this.updateFilterValue$.pipe(takeUntilDestroyed()).subscribe((update) => {
+            this._filterState.update(current => {
+                const state = current[update.filterId] || { filter: undefined, value: undefined };
+                return {
+                    ...current,
+                    [update.filterId]: {
+                        ...state,
+                        value: update.value,
+                    },
+                };
+            });
+        });
     }
-    sort(reverse) {
-        if (!this.sortable) {
-            return;
+    register(treetableFilter) {
+        if (!treetableFilter) {
+            return undefined;
         }
-        this._sort.toggle(this._sortBy, reverse);
-        // setting the private variable to not retrigger the setter logic
-        this._sortOrder = this._sort.reverse ? ClrTreetableSortOrder.DESC : ClrTreetableSortOrder.ASC;
-        // Sets the correct icon for current sort order
-        this._sortDirection = this._sortOrder === ClrTreetableSortOrder.DESC ? 'down' : 'up';
-        this.sortOrderChange.emit(this._sortOrder);
-    }
-    listenForSortingChanges() {
-        this._sort.change.pipe(takeUntilDestroyed()).subscribe(sort => {
-            // Need to manually mark the component to be checked
-            // for both activating and deactivating sorting
-            this._cdr.markForCheck();
-            // We're only listening to make sure we emit an event when the column goes from sorted to unsorted
-            if (this.sortOrder !== ClrTreetableSortOrder.UNSORTED && sort.comparator !== this._sortBy) {
-                this._sortOrder = ClrTreetableSortOrder.UNSORTED;
-                this.sortOrderChange.emit(this._sortOrder);
-                this._sortDirection = null;
+        const filterId = `clr-tt-filter-${this.filterId++}`;
+        const subscription = treetableFilter.changes
+            .pipe(takeUntilDestroyed(this._destroyRef))
+            .subscribe(valueChange => this.updateFilterValue$.next({ filterId, value: valueChange }));
+        let hasUnregistered = false;
+        const registered = new RegisteredTreetableFilter(treetableFilter, () => {
+            if (hasUnregistered) {
+                return;
             }
+            subscription.unsubscribe();
+            this._filterState.update(current => {
+                delete current[filterId];
+                return { ...current };
+            });
+            hasUnregistered = true;
         });
+        this._filterState.update(current => {
+            const state = current[filterId] || { filter: undefined, value: undefined };
+            return {
+                ...current,
+                [filterId]: {
+                    ...state,
+                    filter: registered,
+                },
+            };
+        });
+        return registered;
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.6", ngImport: i0, type: ClrTreetableColumn, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.6", type: ClrTreetableColumn, isStandalone: false, selector: "clr-tt-column", inputs: { sortBy: ["clrTtSortBy", "sortBy"], sortOrder: ["clrTtSortOrder", "sortOrder"] }, outputs: { sortOrderChange: "clrTtSortOrderChange" }, host: { attributes: { "role": "columnheader" }, properties: { "class.treetable-column": "true", "attr.aria-sort": "ariaSort" } }, ngImport: i0, template: `
-    @if(sortable) {
-    <button class="treetable-column-title" (click)="sort()" type="button">
-      <ng-container *ngTemplateOutlet="columnTitle" />
-      <cds-icon
-        *ngIf="sortDirection"
-        shape="arrow"
-        [attr.direction]="sortDirection"
-        aria-hidden="true"
-        class="sort-icon"
-      />
-    </button>
-    } @else {
-    <ng-container *ngTemplateOutlet="columnTitle" />
-    }
-
-    <ng-template #columnTitle>
-      <ng-content />
-    </ng-template>
-  `, isInline: true, dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i2.CdsIconCustomTag, selector: "cds-icon" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.6", ngImport: i0, type: Filters, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
+    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "19.2.6", ngImport: i0, type: Filters }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.6", ngImport: i0, type: ClrTreetableColumn, decorators: [{
-            type: Component,
-            args: [{
-                    selector: 'clr-tt-column',
-                    template: `
-    @if(sortable) {
-    <button class="treetable-column-title" (click)="sort()" type="button">
-      <ng-container *ngTemplateOutlet="columnTitle" />
-      <cds-icon
-        *ngIf="sortDirection"
-        shape="arrow"
-        [attr.direction]="sortDirection"
-        aria-hidden="true"
-        class="sort-icon"
-      />
-    </button>
-    } @else {
-    <ng-container *ngTemplateOutlet="columnTitle" />
-    }
-
-    <ng-template #columnTitle>
-      <ng-content />
-    </ng-template>
-  `,
-                    host: {
-                        '[class.treetable-column]': 'true',
-                        '[attr.aria-sort]': 'ariaSort',
-                        role: 'columnheader',
-                    },
-                    changeDetection: ChangeDetectionStrategy.OnPush,
-                    standalone: false,
-                }]
-        }], ctorParameters: () => [], propDecorators: { sortBy: [{
-                type: Input,
-                args: ['clrTtSortBy']
-            }], sortOrder: [{
-                type: Input,
-                args: ['clrTtSortOrder']
-            }] } });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.6", ngImport: i0, type: Filters, decorators: [{
+            type: Injectable
+        }], ctorParameters: () => [] });
 
 /*
  * Copyright (c) 2018-2025 Porsche Informatik. All Rights Reserved.
  * This software is released under MIT license.
  * The full license information can be found in LICENSE in the root directory of this project.
  */
-ClarityIcons.addIcons(ellipsisVerticalIcon);
-class ClrTreetableActionOverflow {
-    constructor(smartToggleService, zone) {
-        this.smartToggleService = smartToggleService;
-        this.zone = zone;
-        this.empty = false;
-        this.smartPosition = {
-            axis: ClrAxis.HORIZONTAL,
-            side: ClrSide.AFTER,
-            anchor: ClrAlignment.CENTER,
-            content: ClrAlignment.CENTER,
-        };
-        this.destroyed$ = new Subject();
-        this.smartToggleService.openChange.pipe(takeUntil(this.destroyed$.asObservable())).subscribe(openState => {
-            if (openState) {
-                this.focusFirstButton();
-            }
-        });
+/**
+ * Compares two sort state objects for equality.
+ * Returns true if they are the same reference, both null/undefined,
+ * or if both comparator and reverse flag match.
+ *
+ * @typeParam T - Type of the row data.
+ * @param a - First sort state or null.
+ * @param b - Second sort state or null.
+ * @returns Whether both sort states are equal.
+ */
+function areSortStatesEqual(a, b) {
+    if (a === b) {
+        return true;
     }
-    focusFirstButton() {
-        this.zone.runOutsideAngular(() => setTimeout(() => {
-            const firstButton = document.querySelector('button.action-item');
-            if (firstButton) {
-                firstButton.focus();
-            }
-        }));
+    if (!a || !b) {
+        return !a && !b;
     }
-    closeOverflowContent(event) {
-        this.smartToggleService.toggleWithEvent(event);
+    return a.reverse === b.reverse && a.comparator === b.comparator;
+}
+/**
+ * Performs a shallow comparison of two filter value arrays.
+ * Treats undefined as an empty array. Order and reference equality of entries matter.
+ *
+ * @param a - First array of filter values or undefined.
+ * @param b - Second array of filter values or undefined.
+ * @returns Whether both arrays have the same length and elements.
+ */
+function areFilterValuesEqual(a, b) {
+    const arrayA = a || [];
+    const arrayB = b || [];
+    if (arrayA.length !== arrayB.length) {
+        return false;
     }
-    ngOnDestroy() {
-        this.destroyed$.next();
-        this.destroyed$.complete();
+    for (let i = 0; i < arrayA.length; i++) {
+        if (arrayA[i] !== arrayB[i]) {
+            return false;
+        }
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.6", ngImport: i0, type: ClrTreetableActionOverflow, deps: [{ token: i2.ClrPopoverToggleService }, { token: i0.NgZone }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.6", type: ClrTreetableActionOverflow, isStandalone: false, selector: "clr-tt-action-overflow", inputs: { empty: "empty" }, host: { attributes: { "role": "cell" }, properties: { "class.treetable-row-actions": "true", "class.treetable-cell": "true" } }, providers: [ClrPopoverToggleService, ClrPopoverEventsService, ClrPopoverPositionService], ngImport: i0, template: `
-    <ng-container *ngIf="!empty">
-      <button class="treetable-action-trigger" clrPopoverAnchor clrPopoverOpenCloseButton>
-        <cds-icon shape="ellipsis-vertical"></cds-icon>
-      </button>
-      <div
-        class="datagrid-action-overflow"
-        clrFocusTrap
-        (click)="closeOverflowContent($event)"
-        *clrPopoverContent="false; at: smartPosition; outsideClickToClose: true; scrollToClose: true"
-      >
-        <ng-content></ng-content>
-      </div>
-    </ng-container>
-  `, isInline: true, dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2.CdsIconCustomTag, selector: "cds-icon" }, { kind: "directive", type: i2.ClrPopoverAnchor, selector: "[clrPopoverAnchor]" }, { kind: "directive", type: i2.ÇlrClrPopoverOpenCloseButton, selector: "[clrPopoverOpenCloseButton]", outputs: ["clrPopoverOpenCloseChange"] }, { kind: "directive", type: i2.ClrPopoverContent, selector: "[clrPopoverContent]", inputs: ["clrPopoverContent", "clrPopoverContentAt", "clrPopoverContentOutsideClickToClose", "clrPopoverContentScrollToClose"] }] }); }
+    return true;
+}
+/**
+ * Compares two treetable states (sort and filters) for equality.
+ *
+ * @typeParam T - Type of the tree node values.
+ * @param prev - Previous state.
+ * @param curr - Current state.
+ * @returns Whether both states are considered equal.
+ */
+function areTreetableStatesEqual(prev, curr) {
+    return areSortStatesEqual(prev.sort, curr.sort) && areFilterValuesEqual(prev.filters, curr.filters);
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.6", ngImport: i0, type: ClrTreetableActionOverflow, decorators: [{
-            type: Component,
-            args: [{
-                    selector: 'clr-tt-action-overflow',
-                    providers: [ClrPopoverToggleService, ClrPopoverEventsService, ClrPopoverPositionService],
-                    template: `
-    <ng-container *ngIf="!empty">
-      <button class="treetable-action-trigger" clrPopoverAnchor clrPopoverOpenCloseButton>
-        <cds-icon shape="ellipsis-vertical"></cds-icon>
-      </button>
-      <div
-        class="datagrid-action-overflow"
-        clrFocusTrap
-        (click)="closeOverflowContent($event)"
-        *clrPopoverContent="false; at: smartPosition; outsideClickToClose: true; scrollToClose: true"
-      >
-        <ng-content></ng-content>
-      </div>
-    </ng-container>
-  `,
-                    host: {
-                        '[class.treetable-row-actions]': 'true',
-                        '[class.treetable-cell]': 'true',
-                        role: 'cell',
-                    },
-                    standalone: false,
-                }]
-        }], ctorParameters: () => [{ type: i2.ClrPopoverToggleService }, { type: i0.NgZone }], propDecorators: { empty: [{
-                type: Input
-            }] } });
 
 /*
  * Copyright (c) 2018-2025 Porsche Informatik. All Rights Reserved.
  * This software is released under MIT license.
  * The full license information can be found in LICENSE in the root directory of this project.
  */
-ClarityIcons.addIcons(angleIcon);
-class ClrTreetableRow {
+class TreetableDataStateService {
     constructor() {
-        this.selection = inject(Selection);
-        this._cdr = inject(ChangeDetectorRef);
-        this._destroyRef = inject(DestroyRef);
-        this._selected = false;
-        this.shouldAnimate = signal(false);
-        this.expanded = false;
-        this.clickable = true;
-        this.expandable = false;
-        this.clrTtItem = input();
-        this.hasActionOverflow = new EventEmitter();
-        this.expandedChange = new EventEmitter();
-        this.selectedChanged = new EventEmitter(false);
-        this.showActionOverflow = false;
-        this.showEmptyActionOverflow = false;
-        this.showClickClass = false;
-        this.SelectionType = SelectionType;
-    }
-    set actionOverflow(actionOverflow) {
-        this.showActionOverflow = !!actionOverflow;
-        this.showEmptyActionOverflow = !this.showActionOverflow;
-        this.hasActionOverflow.emit(this.showActionOverflow);
-    }
-    ngOnInit() {
-        this.showClickClass = this.expandable && this.clickable;
-        // We need to trigger change detection when the checkbox in overall treetable is clicked
-        // because of ChangeDetectionStrategy.OnPush
-        this.selection.allSelectedChange.pipe(takeUntilDestroyed(this._destroyRef)).subscribe(() => {
-            this._cdr.markForCheck();
+        this._filters = inject((Filters));
+        this._sort = inject((Sort));
+        this._dataSource = signal(undefined);
+        this._stickyIndeterminate = signal(false);
+        this._itemsExternallySelected = signal([]);
+        this._treetableNodes = computed(() => {
+            const dataSource = this._dataSource();
+            const stickyIndeterminate = this._stickyIndeterminate();
+            return dataSource
+                ? dataSource.items.map(item => mapToInternalTree(item, dataSource.getChildren, stickyIndeterminate))
+                : [];
+        });
+        this._filteredNodes = computed(() => {
+            const treetableNodes = this._treetableNodes();
+            const activeFilters = this._filters.activeFilters();
+            const hasActiveFilters = this._filters.hasActiveFilters();
+            if (!hasActiveFilters) {
+                return treetableNodes;
+            }
+            return this.filterTreeRecursively(treetableNodes, activeFilters);
+        });
+        this.displayedNodes = computed(() => {
+            const nodes = this._filteredNodes();
+            const { comparator } = this._sort.sortState();
+            if (!comparator) {
+                return nodes;
+            }
+            return this.sortTreeRecursively(nodes);
+        });
+        this.areAllNodesSelected = computed(() => this.displayedNodes().every(node => node.selected() === ClrTreetableSelectedState.SELECTED));
+        this.selectedNodes = computed(() => {
+            const result = [];
+            this.traverseTreeNodes(this.displayedNodes(), (node) => {
+                if (node.selected() === ClrTreetableSelectedState.SELECTED) {
+                    result.push(node.value);
+                }
+            });
+            return result;
+        });
+        this.changes$ = combineLatest([
+            this._filters.changes$,
+            this._sort.changes$,
+        ]).pipe(map$1(([filterValues, sortState]) => ({
+            sort: sortState.comparator ? { comparator: sortState.comparator, reverse: sortState.reverse } : null,
+            filters: filterValues,
+        })), skip(1), auditTime(500), distinctUntilChanged((a, b) => areTreetableStatesEqual(a, b)), shareReplay(1));
+        // Externally selected has to be handled as a signal, as it is a synchronous change. Simply using a subject instead
+        // of a signal results in errors.
+        const externallySelectedItems$ = toObservable(this._itemsExternallySelected).pipe(map$1(items => new Set(items)));
+        const treetableNodes$ = toObservable(this._treetableNodes).pipe(filter$1(nodes => nodes.length > 0));
+        const handleExternalSelect$ = combineLatest([externallySelectedItems$, treetableNodes$]);
+        // This stream handles the external setting of selected nodes. Typically, this will run only once in the
+        // beginning, if some nodes need to be selected from the start (e.g. restoring treetable state from local storage).
+        // The subscribe function only runs, if the selectedItems differ in length to the currently selectedNodes.
+        handleExternalSelect$
+            .pipe(map$1(([externallySelectedItems, treetableNodes]) => ({
+            externallySelectedItems: externallySelectedItems,
+            nodes: treetableNodes,
+            selectedNodes: this.selectedNodes(),
+        })), filter$1(({ externallySelectedItems, selectedNodes }) => externallySelectedItems.size !== selectedNodes.length), takeUntilDestroyed())
+            .subscribe(({ externallySelectedItems, nodes }) => {
+            if (externallySelectedItems.size === 0) {
+                this.setSelectionForDisplayedNodes(ClrTreetableSelectedState.UNSELECTED);
+                return;
+            }
+            this.traverseTreeNodes(nodes, (node) => {
+                if (externallySelectedItems.has(node.value)) {
+                    node.setSelected(ClrTreetableSelectedState.SELECTED);
+                    // Remove node and all descendants from set to speed up external selection.
+                    externallySelectedItems.delete(node.value);
+                    for (const descendant of node.getFlatDescendants() ?? []) {
+                        externallySelectedItems.delete(descendant.value);
+                    }
+                }
+            }, () => externallySelectedItems.size > 0);
         });
     }
-    onExpandCollapseClick() {
-        // Only animate on user click (not on sorting or initial rendering)
-        this.shouldAnimate.set(true);
-        this.toggleExpand();
-        // Remove .animate after animation to prevent unwanted transitions
-        setTimeout(() => {
-            this.shouldAnimate.set(false);
-        }, 350);
+    setDataSource(items, getChildren) {
+        this._dataSource.set({ items, getChildren });
     }
-    toggle(selected = !this.selected) {
-        if (selected !== this.selected) {
-            this.selected = selected;
-            this.selectedChanged.emit(selected);
-        }
+    setExternallySelectedItems(items) {
+        this._itemsExternallySelected.set(items);
     }
-    toggleExpand() {
-        if (this.expandable) {
-            this.expanded = !this.expanded;
-            this.expandedChange.emit(this.expanded);
-        }
+    setStickyIndeterminate(value) {
+        this._stickyIndeterminate.set(value);
     }
-    onRowClick(event) {
-        if (this.clickable && !event.target.closest('.treetable-action-trigger')) {
-            this.onExpandCollapseClick();
-        }
+    toggleSelectionForDisplayedNodes() {
+        const nextState = this.areAllNodesSelected()
+            ? ClrTreetableSelectedState.UNSELECTED
+            : ClrTreetableSelectedState.SELECTED;
+        this.setSelectionForDisplayedNodes(nextState);
     }
-    onCaretClick() {
-        if (!this.clickable) {
-            this.onExpandCollapseClick();
+    setSelectionForDisplayedNodes(state) {
+        for (const node of this.displayedNodes()) {
+            node.setSelected(state);
         }
     }
-    get selected() {
-        if (this.selection.selectionType === SelectionType.None) {
-            return this._selected;
-        }
-        else {
-            return this.selection.isSelected(this.clrTtItem());
+    /**
+     * Recursively filters the provided <code>ClrTreetableTreeNodes</code>. It returns the lowest depth nodes of the
+     * provided nodes, that pass all the filters and it's ancestors. The method returns a cloned subset of the provided nodes.
+     *
+     * @param nodes The nodes to filter.
+     * @param activeFilters The currently active filters that have to be passed.
+     * @param parent The parent node to set for the recursive filtering.
+     * @private
+     */
+    filterTreeRecursively(nodes, activeFilters, parent = null) {
+        const passesAllFilters = (node) => activeFilters.every(f => f.accepts(node.value));
+        const result = [];
+        for (const original of nodes) {
+            const filteredChildren = this.filterTreeRecursively(original.children, activeFilters, null);
+            if (filteredChildren.length > 0 || passesAllFilters(original)) {
+                // A new instance is necessary here, for the selection state to still work
+                const newNode = new ClrTreetableTreeNode(original.value, parent, [], this._stickyIndeterminate());
+                newNode.children = filteredChildren.map(child => {
+                    child.parent = newNode;
+                    return child;
+                });
+                result.push(newNode);
+            }
         }
+        return result;
     }
-    set selected(value) {
-        this.selection.setSelected(this.clrTtItem(), value);
+    sortTreeRecursively(nodes) {
+        const sortedNodes = [...nodes].sort((nodeA, nodeB) => this._sort.compare(nodeA.value, nodeB.value));
+        return sortedNodes.map(node => {
+            if (!node.isLeaf) {
+                const cloned = Object.assign(Object.create(Object.getPrototypeOf(node)), node);
+                cloned.children = this.sortTreeRecursively(node.children);
+                return cloned;
+            }
+            return node;
+        });
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.6", ngImport: i0, type: ClrTreetableRow, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.6", type: ClrTreetableRow, isStandalone: false, selector: "clr-tt-row", inputs: { expanded: { classPropertyName: "expanded", publicName: "clrExpanded", isSignal: false, isRequired: false, transformFunction: null }, clickable: { classPropertyName: "clickable", publicName: "clrClickable", isSignal: false, isRequired: false, transformFunction: null }, expandable: { classPropertyName: "expandable", publicName: "clrExpandable", isSignal: false, isRequired: false, transformFunction: null }, clrTtItem: { classPropertyName: "clrTtItem", publicName: "clrTtItem", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { hasActionOverflow: "hasActionOverflow", expandedChange: "clrExpandedChange", selectedChanged: "clrTtSelectedChange" }, host: { properties: { "class.treetable-row-wrapper": "true", "class.treetable-selected": "selected" } }, queries: [{ propertyName: "actionOverflow", first: true, predicate: ClrTreetableActionOverflow, descendants: true }], ngImport: i0, template: "<!--\n  ~ Copyright (c) 2018-2025 Porsche Informatik. All Rights Reserved.\n  ~ This software is released under MIT license.\n  ~ The full license information can be found in LICENSE in the root directory of this project.\n  -->\n\n<div\n  [ngClass]=\"{'clr-row-clickable': showClickClass, 'treetable-selected': selected}\"\n  class=\"clr-tt-node-content treetable-row\"\n  (click)=\"onRowClick($event)\"\n>\n  @if(selection.selectionType === SelectionType.Multi){\n  <div class=\"clr-checkbox-wrapper treetable-row-selection treetable-cell\">\n    <input type=\"checkbox\" [ngModel]=\"selected\" (ngModelChange)=\"toggle($event)\" (click)=\"$event.stopPropagation()\" />\n  </div>\n  }\n\n  <ng-content select=\"clr-tt-action-overflow\"></ng-content>\n  <clr-tt-action-overflow *ngIf=\"showActionOverflow && showEmptyActionOverflow\" [empty]=\"true\"></clr-tt-action-overflow>\n  <div class=\"treetable-scrolling-cells\">\n    <div class=\"treetable-expandable-caret\" *ngIf=\"expandable\">\n      <button type=\"button\" class=\"treetable-expandable-caret-button\" (click)=\"onCaretClick()\">\n        <cds-icon\n          shape=\"angle\"\n          [attr.direction]=\"expanded ? 'down' : 'right'\"\n          class=\"treetable-expandable-caret-icon\"\n        ></cds-icon>\n      </button>\n    </div>\n\n    <ng-content select=\"clr-tt-cell\"></ng-content>\n  </div>\n</div>\n\n<div\n  class=\"treetable-row-animation-container\"\n  [class.expanded]=\"expanded\"\n  [class.collapsed]=\"!expanded\"\n  [class.animate]=\"shouldAnimate()\"\n>\n  <div class=\"treetable-row-animation-wrapper\">\n    <ng-content select=\"clr-tt-row\"></ng-content>\n  </div>\n</div>\n", styles: [".treetable-row-animation-container.expanded{display:grid;grid-template-rows:1fr;opacity:1}.treetable-row-animation-container.collapsed{display:none;grid-template-rows:0fr;opacity:0}.treetable-row-animation-container.animate{transition:grid-template-rows .3s ease,opacity .3s ease,display .3s ease allow-discrete}@starting-style{.treetable-row-animation-container.animate.expanded{grid-template-rows:0fr;opacity:0}}@starting-style{.treetable-row-animation-container.animate.collapsed{grid-template-rows:1fr;opacity:1}}.treetable-row-animation-wrapper{min-height:0;overflow:hidden}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2.CdsIconCustomTag, selector: "cds-icon" }, { kind: "directive", type: i3$1.CheckboxControlValueAccessor, selector: "input[type=checkbox][formControlName],input[type=checkbox][formControl],input[type=checkbox][ngModel]" }, { kind: "directive", type: i3$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i3$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: ClrTreetableActionOverflow, selector: "clr-tt-action-overflow", inputs: ["empty"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    traverseTreeNodes(nodes, callBackFn, breakCondition = () => true) {
+        for (const node of nodes) {
+            callBackFn(node);
+            if (!node.isLeaf && breakCondition(node)) {
+                this.traverseTreeNodes(node.children, callBackFn, breakCondition);
+            }
+        }
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.6", ngImport: i0, type: TreetableDataStateService, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
+    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "19.2.6", ngImport: i0, type: TreetableDataStateService }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.6", ngImport: i0, type: ClrTreetableRow, decorators: [{
-            type: Component,
-            args: [{ selector: 'clr-tt-row', host: { '[class.treetable-row-wrapper]': 'true', '[class.treetable-selected]': 'selected' }, standalone: false, changeDetection: ChangeDetectionStrategy.OnPush, template: "<!--\n  ~ Copyright (c) 2018-2025 Porsche Informatik. All Rights Reserved.\n  ~ This software is released under MIT license.\n  ~ The full license information can be found in LICENSE in the root directory of this project.\n  -->\n\n<div\n  [ngClass]=\"{'clr-row-clickable': showClickClass, 'treetable-selected': selected}\"\n  class=\"clr-tt-node-content treetable-row\"\n  (click)=\"onRowClick($event)\"\n>\n  @if(selection.selectionType === SelectionType.Multi){\n  <div class=\"clr-checkbox-wrapper treetable-row-selection treetable-cell\">\n    <input type=\"checkbox\" [ngModel]=\"selected\" (ngModelChange)=\"toggle($event)\" (click)=\"$event.stopPropagation()\" />\n  </div>\n  }\n\n  <ng-content select=\"clr-tt-action-overflow\"></ng-content>\n  <clr-tt-action-overflow *ngIf=\"showActionOverflow && showEmptyActionOverflow\" [empty]=\"true\"></clr-tt-action-overflow>\n  <div class=\"treetable-scrolling-cells\">\n    <div class=\"treetable-expandable-caret\" *ngIf=\"expandable\">\n      <button type=\"button\" class=\"treetable-expandable-caret-button\" (click)=\"onCaretClick()\">\n        <cds-icon\n          shape=\"angle\"\n          [attr.direction]=\"expanded ? 'down' : 'right'\"\n          class=\"treetable-expandable-caret-icon\"\n        ></cds-icon>\n      </button>\n    </div>\n\n    <ng-content select=\"clr-tt-cell\"></ng-content>\n  </div>\n</div>\n\n<div\n  class=\"treetable-row-animation-container\"\n  [class.expanded]=\"expanded\"\n  [class.collapsed]=\"!expanded\"\n  [class.animate]=\"shouldAnimate()\"\n>\n  <div class=\"treetable-row-animation-wrapper\">\n    <ng-content select=\"clr-tt-row\"></ng-content>\n  </div>\n</div>\n", styles: [".treetable-row-animation-container.expanded{display:grid;grid-template-rows:1fr;opacity:1}.treetable-row-animation-container.collapsed{display:none;grid-template-rows:0fr;opacity:0}.treetable-row-animation-container.animate{transition:grid-template-rows .3s ease,opacity .3s ease,display .3s ease allow-discrete}@starting-style{.treetable-row-animation-container.animate.expanded{grid-template-rows:0fr;opacity:0}}@starting-style{.treetable-row-animation-container.animate.collapsed{grid-template-rows:1fr;opacity:1}}.treetable-row-animation-wrapper{min-height:0;overflow:hidden}\n"] }]
-        }], propDecorators: { expanded: [{
-                type: Input,
-                args: ['clrExpanded']
-            }], clickable: [{
-                type: Input,
-                args: ['clrClickable']
-            }], expandable: [{
-                type: Input,
-                args: ['clrExpandable']
-            }], hasActionOverflow: [{
-                type: Output
-            }], expandedChange: [{
-                type: Output,
-                args: ['clrExpandedChange']
-            }], selectedChanged: [{
-                type: Output,
-                args: ['clrTtSelectedChange']
-            }], actionOverflow: [{
-                type: ContentChild,
-                args: [ClrTreetableActionOverflow]
-            }] } });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.6", ngImport: i0, type: TreetableDataStateService, decorators: [{
+            type: Injectable
+        }], ctorParameters: () => [] });
 
 /*
  * Copyright (c) 2018-2025 Porsche Informatik. All Rights Reserved.
  * This software is released under MIT license.
  * The full license information can be found in LICENSE in the root directory of this project.
  */
-class TreetableItemsDirective {
-    get clrTtItems() {
-        return this.ttItems();
-    }
-    set clrTtItems(items) {
-        if (items == null || items.length === 0) {
-            return;
-        }
-        this._items.addItems(items);
-        if (this._sort.comparator) {
-            this._cdr.detach();
-            items.sort((a, b) => this._sort.compare(a, b)); // Sort in place
-            this._cdr.reattach();
-        }
-        this.ttItems.set(items);
-    }
-    set trackBy(value) {
-        this._iterableProxy.ngForTrackBy = value;
-    }
+class ClrTreetable {
     constructor() {
-        this._items = inject((Items));
-        this._sort = inject((Sort));
-        this._template = inject((TemplateRef));
-        this._differs = inject(IterableDiffers);
-        this._vcr = inject(ViewContainerRef);
-        this._cdr = inject(ChangeDetectorRef);
-        this.ttItems = signal([]);
-        this._iterableProxy = new NgForOf(this._vcr, this._template, this._differs);
+        this._dataStateService = inject((TreetableDataStateService));
+        this._recursionService = inject((ClrTreetableRecursionService));
+        this.clrClickableRows = input(true);
+        this.clrHideHeader = input(false);
+        this.clrTtLoading = input(false);
+        this.clrTtSelected = input(undefined);
+        this.clrTtAutoParentSelection = input(true);
+        this.clrTtSelectedChange = outputFromObservable(toObservable(this._dataStateService.selectedNodes));
+        this.clrTtRefresh = outputFromObservable(this._dataStateService.changes$);
+        this._ttRows = contentChildren(ClrTreetableRow, { descendants: true });
+        this._actionOverflow = contentChildren(ClrTreetableActionOverflow, { descendants: true });
+        this.empty = computed(() => !this._ttRows() || this._ttRows().length === 0);
+        this.displayedNodes = this._dataStateService.displayedNodes;
+        this.isRecursionMode = this._recursionService.isRecursionMode;
+        this.selectionType = computed(() => (this.clrTtSelected() ? SelectionType.Multi : SelectionType.None));
+        this.showSelection = computed(() => this.selectionType() === SelectionType.Multi);
+        this.areAllRowsSelected = computed(() => this._dataStateService.areAllNodesSelected());
+        this.hasActionOverflow = computed(() => this._actionOverflow()?.length > 0);
         effect(() => {
-            const newItems = this.ttItems();
-            if (newItems) {
-                this._iterableProxy.ngForOf = newItems;
-                this._iterableProxy.ngDoCheck();
+            const selectedItems = this.clrTtSelected();
+            if (selectedItems) {
+                this._dataStateService.setExternallySelectedItems(selectedItems);
             }
         });
+        effect(() => {
+            this._dataStateService.setStickyIndeterminate(!this.clrTtAutoParentSelection());
+        });
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.6", ngImport: i0, type: TreetableItemsDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "19.2.6", type: TreetableItemsDirective, isStandalone: false, selector: "[clrTtItems]", inputs: { clrTtItems: "clrTtItems", trackBy: ["clrTtItemsTrackBy", "trackBy"] }, ngImport: i0 }); }
+    toggleSelectAll() {
+        this._dataStateService.toggleSelectionForDisplayedNodes();
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.6", ngImport: i0, type: ClrTreetable, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.6", type: ClrTreetable, isStandalone: false, selector: "clr-treetable", inputs: { clrClickableRows: { classPropertyName: "clrClickableRows", publicName: "clrClickableRows", isSignal: true, isRequired: false, transformFunction: null }, clrHideHeader: { classPropertyName: "clrHideHeader", publicName: "clrHideHeader", isSignal: true, isRequired: false, transformFunction: null }, clrTtLoading: { classPropertyName: "clrTtLoading", publicName: "clrTtLoading", isSignal: true, isRequired: false, transformFunction: null }, clrTtSelected: { classPropertyName: "clrTtSelected", publicName: "clrTtSelected", isSignal: true, isRequired: false, transformFunction: null }, clrTtAutoParentSelection: { classPropertyName: "clrTtAutoParentSelection", publicName: "clrTtAutoParentSelection", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { clrTtSelectedChange: "clrTtSelectedChange", clrTtRefresh: "clrTtRefresh" }, host: { properties: { "class.empty": "empty()", "class.treetable-host": "true" } }, providers: [TREETABLE_RECURSION_SERVICE_PROVIDER, TreetableDataStateService, Sort, Filters], queries: [{ propertyName: "_ttRows", predicate: ClrTreetableRow, descendants: true, isSignal: true }, { propertyName: "_actionOverflow", predicate: ClrTreetableActionOverflow, descendants: true, isSignal: true }], ngImport: i0, template: "<!--\n  ~ Copyright (c) 2018-2025 Porsche Informatik. All Rights Reserved.\n  ~ This software is released under MIT license.\n  ~ The full license information can be found in LICENSE in the root directory of this project.\n  -->\n\n<div class=\"treetable\">\n  <div class=\"treetable-grid\" role=\"grid\">\n    <div class=\"treetable-header\" role=\"rowgroup\" [class.hide-header]=\"clrHideHeader()\">\n      @if (showSelection() && !empty()) {\n      <div class=\"clr-checkbox-wrapper treetable-row-selection treetable-column\" role=\"row\">\n        <input\n          type=\"checkbox\"\n          data-testId=\"clrTtSelectAll\"\n          [checked]=\"areAllRowsSelected()\"\n          (change)=\"toggleSelectAll()\"\n        />\n      </div>\n      }\n\n      <div *ngIf=\"hasActionOverflow()\" class=\"treetable-row-actions treetable-column\">&nbsp;</div>\n      <div class=\"treetable-row-scrollable\" role=\"row\">\n        <ng-content select=\"clr-tt-column\" />\n      </div>\n    </div>\n    <div class=\"treetable-body\">\n      @if (isRecursionMode()) {\n      <clr-tt-recursive-rows [children]=\"displayedNodes()\" />\n      } @else {\n      <ng-content select=\"clr-tt-row\" />\n      } @if (empty()) {\n      <ng-content select=\"clr-tt-placeholder\" />\n      }\n    </div>\n  </div>\n  @if (clrTtLoading()) {\n  <div class=\"treetable-spinner\">\n    <clr-spinner clrMedium />\n  </div>\n  }\n</div>\n", dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i2.ClrSpinner, selector: "clr-spinner", inputs: ["clrInline", "clrInverse", "clrSmall", "clrMedium"] }, { kind: "component", type: ClrTreetableRecursiveRows, selector: "clr-tt-recursive-rows", inputs: ["parent", "children"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.6", ngImport: i0, type: TreetableItemsDirective, decorators: [{
-            type: Directive,
-            args: [{
-                    selector: '[clrTtItems]',
-                    standalone: false,
-                }]
-        }], ctorParameters: () => [], propDecorators: { clrTtItems: [{
-                type: Input
-            }], trackBy: [{
-                type: Input,
-                args: ['clrTtItemsTrackBy']
-            }] } });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.6", ngImport: i0, type: ClrTreetable, decorators: [{
+            type: Component,
+            args: [{ selector: 'clr-treetable', host: { '[class.empty]': 'empty()', '[class.treetable-host]': 'true' }, providers: [TREETABLE_RECURSION_SERVICE_PROVIDER, TreetableDataStateService, Sort, Filters], changeDetection: ChangeDetectionStrategy.OnPush, standalone: false, template: "<!--\n  ~ Copyright (c) 2018-2025 Porsche Informatik. All Rights Reserved.\n  ~ This software is released under MIT license.\n  ~ The full license information can be found in LICENSE in the root directory of this project.\n  -->\n\n<div class=\"treetable\">\n  <div class=\"treetable-grid\" role=\"grid\">\n    <div class=\"treetable-header\" role=\"rowgroup\" [class.hide-header]=\"clrHideHeader()\">\n      @if (showSelection() && !empty()) {\n      <div class=\"clr-checkbox-wrapper treetable-row-selection treetable-column\" role=\"row\">\n        <input\n          type=\"checkbox\"\n          data-testId=\"clrTtSelectAll\"\n          [checked]=\"areAllRowsSelected()\"\n          (change)=\"toggleSelectAll()\"\n        />\n      </div>\n      }\n\n      <div *ngIf=\"hasActionOverflow()\" class=\"treetable-row-actions treetable-column\">&nbsp;</div>\n      <div class=\"treetable-row-scrollable\" role=\"row\">\n        <ng-content select=\"clr-tt-column\" />\n      </div>\n    </div>\n    <div class=\"treetable-body\">\n      @if (isRecursionMode()) {\n      <clr-tt-recursive-rows [children]=\"displayedNodes()\" />\n      } @else {\n      <ng-content select=\"clr-tt-row\" />\n      } @if (empty()) {\n      <ng-content select=\"clr-tt-placeholder\" />\n      }\n    </div>\n  </div>\n  @if (clrTtLoading()) {\n  <div class=\"treetable-spinner\">\n    <clr-spinner clrMedium />\n  </div>\n  }\n</div>\n" }]
+        }], ctorParameters: () => [] });
 
 /*
  * Copyright (c) 2018-2025 Porsche Informatik. All Rights Reserved.
  * This software is released under MIT license.
  * The full license information can be found in LICENSE in the root directory of this project.
  */
-class ClrTreetable {
+var ClrTreetableSortOrder;
+(function (ClrTreetableSortOrder) {
+    ClrTreetableSortOrder[ClrTreetableSortOrder["UNSORTED"] = 0] = "UNSORTED";
+    ClrTreetableSortOrder[ClrTreetableSortOrder["ASC"] = 1] = "ASC";
+    ClrTreetableSortOrder[ClrTreetableSortOrder["DESC"] = -1] = "DESC";
+})(ClrTreetableSortOrder || (ClrTreetableSortOrder = {}));
+
+/*
+ * Copyright (c) 2018-2025 Porsche Informatik. All Rights Reserved.
+ * This software is released under MIT license.
+ * The full license information can be found in LICENSE in the root directory of this project.
+ */
+class ClrTreetableColumn {
     constructor() {
-        this.selection = inject((Selection));
-        this._items = inject((Items));
-        this._destroyRef = inject(DestroyRef);
-        this.cdr = inject(ChangeDetectorRef);
-        this.clrClickableRows = true;
-        this.hideHeader = false;
-        this.selectedChanged = new EventEmitter(false);
-        this.empty = true;
-        this.hasActionOverflow = false;
-        this.SelectionType = SelectionType;
-    }
-    set selected(value) {
-        if (value) {
-            this.selection.selectionType = SelectionType.Multi;
-        }
-        else {
-            this.selection.selectionType = SelectionType.None;
-        }
-        this.selection.updateCurrent(value, false);
-    }
-    set ttRows(items) {
-        this._ttRows = items;
-        this.hasActionOverflow = false;
-        this.initClickableRows();
-        this.initEmpty();
-        this.initActionOverflow();
-    }
-    ngAfterViewInit() {
-        this.selection.change.pipe(takeUntilDestroyed(this._destroyRef)).subscribe(items => {
-            this.selectedChanged.emit(items);
+        this._sort = inject((Sort));
+        this.clrTtSortBy = input(null);
+        this.clrTtSortOrder = input(ClrTreetableSortOrder.UNSORTED);
+        this.clrTtSortOrderChange = output();
+        this._internalSortOrder = computed(() => {
+            const sortState = this._sort.sortState();
+            const sortBy = this.clrTtSortBy();
+            if (sortBy == null || sortState.comparator !== sortBy) {
+                return ClrTreetableSortOrder.UNSORTED;
+            }
+            return sortState.reverse ? ClrTreetableSortOrder.DESC : ClrTreetableSortOrder.ASC;
         });
-        //_items changed, therefore we need to update the ttItems in the directives
-        // in order to display them right again -> e.g when sorting changed
-        this._items.change.pipe(takeUntilDestroyed(this._destroyRef)).subscribe((allItems) => {
-            const directives = this.iterator.toArray();
-            directives.forEach((directive, index) => {
-                if (allItems[index]) {
-                    const sortedItems = [...allItems[index]];
-                    directive.ttItems.set(sortedItems);
-                }
-            });
+        this.isSortable = computed(() => !!this.clrTtSortBy());
+        this.sortDirection = computed(() => {
+            const order = this._internalSortOrder();
+            if (order === ClrTreetableSortOrder.UNSORTED) {
+                return null;
+            }
+            return order === ClrTreetableSortOrder.DESC ? 'down' : 'up';
+        });
+        this.ariaSort = computed(() => {
+            switch (this._internalSortOrder()) {
+                case ClrTreetableSortOrder.ASC:
+                    return 'ascending';
+                case ClrTreetableSortOrder.DESC:
+                    return 'descending';
+                case ClrTreetableSortOrder.UNSORTED:
+                default:
+                    return 'none';
+            }
+        });
+        // Handle incoming sort order changes
+        const sortOrder$ = toObservable(this.clrTtSortOrder);
+        const sortBy$ = toObservable(this.clrTtSortBy);
+        const handleExternalSortOrderChange$ = combineLatest([sortOrder$, sortBy$]);
+        // CombineLatest does not contain sortState, because only external sort changes should trigger this stream.
+        // Only react to external sort order changes, if no current sortState exists, or this column is responsible for it.
+        handleExternalSortOrderChange$
+            .pipe(map$1(([sortOrder, comparator]) => ({
+            sortOrder,
+            comparator,
+            sortState: this._sort.sortState(),
+        })), filter$1(({ comparator, sortState }) => !!comparator && (sortState.comparator == null || sortState.comparator === comparator)), map$1(({ sortOrder, comparator, sortState }) => ({
+            sortOrder: sortOrder,
+            isCurrentActiveComparator: sortState.comparator === comparator,
+            reverse: sortState.reverse,
+        })), takeUntilDestroyed())
+            .subscribe(({ sortOrder, isCurrentActiveComparator, reverse }) => {
+            switch (sortOrder) {
+                case ClrTreetableSortOrder.ASC:
+                    if (!isCurrentActiveComparator || (isCurrentActiveComparator && reverse)) {
+                        this.sort(false);
+                    }
+                    break;
+                case ClrTreetableSortOrder.DESC:
+                    if (!isCurrentActiveComparator || (isCurrentActiveComparator && !reverse)) {
+                        this.sort(true);
+                    }
+                    break;
+                case ClrTreetableSortOrder.UNSORTED:
+                    if (isCurrentActiveComparator) {
+                        this._sort.clear();
+                    }
+                    break;
+            }
+        });
+        // Emit sort order changes of the column
+        effect(() => {
+            const internalSortOrder = this._internalSortOrder();
+            this.clrTtSortOrderChange.emit(internalSortOrder);
         });
     }
-    initClickableRows() {
-        if (this._ttRows) {
-            this._ttRows.forEach(ttRow => {
-                ttRow.clickable = this.clrClickableRows;
-            });
+    sort(reverse) {
+        const comparator = this.clrTtSortBy();
+        if (!comparator) {
+            return;
         }
+        this._sort.toggle(comparator, reverse);
     }
-    initEmpty() {
-        this.empty = this._ttRows.length === 0;
-    }
-    initActionOverflow() {
-        this._ttRows.forEach(row => {
-            this.setActionOverflow(row.showActionOverflow);
-            row.hasActionOverflow.pipe(takeUntilDestroyed(this._destroyRef)).subscribe((hasActionOverflow) => {
-                this.setActionOverflow(hasActionOverflow);
-            });
-        });
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.6", ngImport: i0, type: ClrTreetableColumn, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.6", 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 } }, outputs: { clrTtSortOrderChange: "clrTtSortOrderChange" }, host: { attributes: { "role": "columnheader" }, properties: { "class.treetable-column": "true", "attr.aria-sort": "ariaSort()" } }, providers: [ClrPopoverToggleService, ClrPopoverEventsService, ClrPopoverPositionService], hostDirectives: [{ directive: i2.ClrPopoverHostDirective }], ngImport: i0, template: `
+    @if (isSortable()) {
+    <button type="button" class="treetable-column-title" data-testId="clrTtSortButton" (click)="sort()">
+      <ng-container *ngTemplateOutlet="columnTitle" />
+      @if (sortDirection()) {
+      <cds-icon
+        shape="arrow"
+        aria-hidden="true"
+        class="sort-icon"
+        data-testId="clrTtSortIndicator"
+        [attr.direction]="sortDirection()"
+      />
+      }
+    </button>
+    } @else {
+    <div class="treetable-column-title">
+      <ng-container *ngTemplateOutlet="columnTitle" />
+    </div>
     }
-    setActionOverflow(hasActionOverflow) {
-        if (!this.hasActionOverflow && hasActionOverflow) {
-            this.hasActionOverflow = true;
-            this.cdr.markForCheck();
-            // setTimeout needed, as this method needs to change data which shouldn't be changed anymore in this cycle
-            setTimeout(() => {
-                if (this.hasActionOverflow) {
-                    this._ttRows.forEach(ttRow => (ttRow.showActionOverflow = true));
-                }
-            });
-        }
+
+    <ng-content select="clr-tt-filter, clr-tt-string-filter" />
+
+    <ng-template #columnTitle>
+      <ng-content />
+    </ng-template>
+  `, isInline: true, dependencies: [{ kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i2.CdsIconCustomTag, selector: "cds-icon" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.6", ngImport: i0, type: ClrTreetableColumn, decorators: [{
+            type: Component,
+            args: [{
+                    selector: 'clr-tt-column',
+                    providers: [ClrPopoverToggleService, ClrPopoverEventsService, ClrPopoverPositionService],
+                    template: `
+    @if (isSortable()) {
+    <button type="button" class="treetable-column-title" data-testId="clrTtSortButton" (click)="sort()">
+      <ng-container *ngTemplateOutlet="columnTitle" />
+      @if (sortDirection()) {
+      <cds-icon
+        shape="arrow"
+        aria-hidden="true"
+        class="sort-icon"
+        data-testId="clrTtSortIndicator"
+        [attr.direction]="sortDirection()"
+      />
+      }
+    </button>
+    } @else {
+    <div class="treetable-column-title">
+      <ng-container *ngTemplateOutlet="columnTitle" />
+    </div>
     }
-    get allSelected() {
-        return this.selection.isAllSelected();
+
+    <ng-content select="clr-tt-filter, clr-tt-string-filter" />
+
+    <ng-template #columnTitle>
+      <ng-content />
+    </ng-template>
+  `,
+                    hostDirectives: [ClrPopoverHostDirective],
+                    host: {
+                        '[class.treetable-column]': 'true',
+                        '[attr.aria-sort]': 'ariaSort()',
+                        role: 'columnheader',
+                    },
+                    changeDetection: ChangeDetectionStrategy.OnPush,
+                    standalone: false,
+                }]
+        }], ctorParameters: () => [] });
+
+/*
+ * Copyright (c) 2018-2025 Porsche Informatik. All Rights Reserved.
+ * This software is released under MIT license.
+ * The full license information can be found in LICENSE in the root directory of this project.
+ */
+class ClrTreetableFilter {
+    constructor() {
+        this.commonStringsService = inject(ClrCommonStringsService);
+        this.smartToggleService = inject(ClrPopoverToggleService);
+        this.filterProvider = inject((Filters));
+        // Smart Popover
+        this.smartPosition = {
+            axis: ClrAxis.VERTICAL,
+            side: ClrSide.AFTER,
+            anchor: ClrAlignment.END,
+            content: ClrAlignment.END,
+        };
+        this.clrTtFilter = input.required();
+        this.registered = signal(undefined);
+        this.open = toSignal(this.smartToggleService.openChange);
+        this.active = computed(() => this.clrTtFilter()?.isActive());
     }
-    set allSelected(_) {
-        /**
-         * This is a setter but we ignore the value.
-         * It's strange, but it lets us have an indeterminate state where only
-         * some of the _items are selected.
-         */
-        this.selection.toggleAll();
+    ngOnInit() {
+        this.registered.set(this.filterProvider.register(this.clrTtFilter()));
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.6", ngImport: i0, type: ClrTreetable, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.6", type: ClrTreetable, isStandalone: false, selector: "clr-treetable", inputs: { clrClickableRows: "clrClickableRows", hideHeader: ["clrHideHeader", "hideHeader"], selected: ["clrTtSelected", "selected"] }, outputs: { selectedChanged: "clrTtSelectedChange" }, host: { properties: { "class.empty": "empty", "class.treetable-host": "true" } }, providers: [Selection, Items, Sort], queries: [{ propertyName: "ttColumns", predicate: ClrTreetableColumn, descendants: true }, { propertyName: "ttRows", predicate: ClrTreetableRow, descendants: true }, { propertyName: "iterator", predicate: TreetableItemsDirective, descendants: true }], ngImport: i0, template: "<!--\n  ~ Copyright (c) 2018-2025 Porsche Informatik. All Rights Reserved.\n  ~ This software is released under MIT license.\n  ~ The full license information can be found in LICENSE in the root directory of this project.\n  -->\n\n<div class=\"treetable\">\n  <div class=\"treetable-grid\" role=\"grid\">\n    <div class=\"treetable-header\" role=\"rowgroup\" [class.hide-header]=\"hideHeader\">\n      @if(selection.selectionType === SelectionType.Multi && !empty){\n      <div class=\"clr-checkbox-wrapper treetable-row-selection treetable-column\" role=\"row\">\n        <input type=\"checkbox\" [(ngModel)]=\"allSelected\" />\n      </div>\n      }\n\n      <div *ngIf=\"hasActionOverflow\" class=\"treetable-row-actions treetable-column\">&nbsp;</div>\n      <div class=\"treetable-row-scrollable\" role=\"row\">\n        <ng-content select=\"clr-tt-column\"></ng-content>\n      </div>\n    </div>\n    <div class=\"treetable-body\">\n      <ng-content select=\"clr-tt-row\"></ng-content>\n      <ng-content select=\"clr-tt-placeholder\"></ng-content>\n    </div>\n  </div>\n</div>\n", dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i3$1.CheckboxControlValueAccessor, selector: "input[type=checkbox][formControlName],input[type=checkbox][formControl],input[type=checkbox][ngModel]" }, { kind: "directive", type: i3$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i3$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    ngOnDestroy() {
+        if (this.registered()) {
+            this.registered().unregister();
+        }
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.6", ngImport: i0, type: ClrTreetableFilter, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "19.2.6", type: ClrTreetableFilter, isStandalone: false, selector: "clr-tt-filter", inputs: { clrTtFilter: { classPropertyName: "clrTtFilter", publicName: "clrTtFilter", isSignal: true, isRequired: true, transformFunction: null } }, ngImport: i0, template: `
+    <button
+      type="button"
+      clrPopoverAnchor
+      clrPopoverOpenCloseButton
+      class="treetable-filter-toggle"
+      data-testId="clrTtToggleFilterButton"
+      [class.treetable-filter-open]="open()"
+      [class.treetable-filtered]="active()"
+      [attr.aria-expanded]="open()"
+    >
+      <cds-icon
+        [attr.status]="active() ? 'info' : null"
+        [attr.shape]="active() ? 'filter-grid-circle' : 'filter-grid'"
+        solid
+      ></cds-icon>
+    </button>
+
+    <div
+      class="treetable-filter"
+      role="dialog"
+      cdkTrapFocus
+      *clrPopoverContent="open(); at: smartPosition; outsideClickToClose: true; scrollToClose: true"
+      [attr.aria-label]="commonStringsService.keys.datagridFilterDialogAriaLabel"
+    >
+      <div class="treetable-filter-close-wrapper">
+        <button type="button" class="close" clrPopoverCloseButton>
+          <cds-icon shape="window-close" [attr.aria-label]="commonStringsService.keys.close"></cds-icon>
+        </button>
+      </div>
+
+      <ng-content></ng-content>
+    </div>
+  `, isInline: true, dependencies: [{ kind: "directive", type: i2.CdsIconCustomTag, selector: "cds-icon" }, { kind: "directive", type: i2.ClrPopoverAnchor, selector: "[clrPopoverAnchor]" }, { kind: "directive", type: i2.ÇlrClrPopoverCloseButton, selector: "[clrPopoverCloseButton]", outputs: ["clrPopoverOnCloseChange"] }, { kind: "directive", type: i2.ÇlrClrPopoverOpenCloseButton, selector: "[clrPopoverOpenCloseButton]", outputs: ["clrPopoverOpenCloseChange"] }, { kind: "directive", type: i2.ClrPopoverContent, selector: "[clrPopoverContent]", inputs: ["clrPopoverContent", "clrPopoverContentAt", "clrPopoverContentOutsideClickToClose", "clrPopoverContentScrollToClose"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.6", ngImport: i0, type: ClrTreetable, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.6", ngImport: i0, type: ClrTreetableFilter, decorators: [{
             type: Component,
-            args: [{ selector: 'clr-treetable', host: { '[class.empty]': 'empty', '[class.treetable-host]': 'true' }, standalone: false, providers: [Selection, Items, Sort], changeDetection: ChangeDetectionStrategy.OnPush, template: "<!--\n  ~ Copyright (c) 2018-2025 Porsche Informatik. All Rights Reserved.\n  ~ This software is released under MIT license.\n  ~ The full license information can be found in LICENSE in the root directory of this project.\n  -->\n\n<div class=\"treetable\">\n  <div class=\"treetable-grid\" role=\"grid\">\n    <div class=\"treetable-header\" role=\"rowgroup\" [class.hide-header]=\"hideHeader\">\n      @if(selection.selectionType === SelectionType.Multi && !empty){\n      <div class=\"clr-checkbox-wrapper treetable-row-selection treetable-column\" role=\"row\">\n        <input type=\"checkbox\" [(ngModel)]=\"allSelected\" />\n      </div>\n      }\n\n      <div *ngIf=\"hasActionOverflow\" class=\"treetable-row-actions treetable-column\">&nbsp;</div>\n      <div class=\"treetable-row-scrollable\" role=\"row\">\n        <ng-content select=\"clr-tt-column\"></ng-content>\n      </div>\n    </div>\n    <div class=\"treetable-body\">\n      <ng-content select=\"clr-tt-row\"></ng-content>\n      <ng-content select=\"clr-tt-placeholder\"></ng-content>\n    </div>\n  </div>\n</div>\n" }]
-        }], propDecorators: { clrClickableRows: [{
-                type: Input
-            }], hideHeader: [{
-                type: Input,
-                args: ['clrHideHeader']
-            }], selected: [{
-                type: Input,
-                args: ['clrTtSelected']
-            }], selectedChanged: [{
-                type: Output,
-                args: ['clrTtSelectedChange']
-            }], ttColumns: [{
-                type: ContentChildren,
-                args: [ClrTreetableColumn, { descendants: true }]
-            }], ttRows: [{
-                type: ContentChildren,
-                args: [ClrTreetableRow, { descendants: true }]
-            }], iterator: [{
-                type: ContentChildren,
-                args: [TreetableItemsDirective, { descendants: true }]
-            }] } });
+            args: [{
+                    selector: 'clr-tt-filter',
+                    template: `
+    <button
+      type="button"
+      clrPopoverAnchor
+      clrPopoverOpenCloseButton
+      class="treetable-filter-toggle"
+      data-testId="clrTtToggleFilterButton"
+      [class.treetable-filter-open]="open()"
+      [class.treetable-filtered]="active()"
+      [attr.aria-expanded]="open()"
+    >
+      <cds-icon
+        [attr.status]="active() ? 'info' : null"
+        [attr.shape]="active() ? 'filter-grid-circle' : 'filter-grid'"
+        solid
+      ></cds-icon>
+    </button>
+
+    <div
+      class="treetable-filter"
+      role="dialog"
+      cdkTrapFocus
+      *clrPopoverContent="open(); at: smartPosition; outsideClickToClose: true; scrollToClose: true"
+      [attr.aria-label]="commonStringsService.keys.datagridFilterDialogAriaLabel"
+    >
+      <div class="treetable-filter-close-wrapper">
+        <button type="button" class="close" clrPopoverCloseButton>
+          <cds-icon shape="window-close" [attr.aria-label]="commonStringsService.keys.close"></cds-icon>
+        </button>
+      </div>
+
+      <ng-content></ng-content>
+    </div>
+  `,
+                    changeDetection: ChangeDetectionStrategy.OnPush,
+                    standalone: false,
+                }]
+        }] });
 
 /*
  * Copyright (c) 2018-2025 Porsche Informatik. All Rights Reserved.
@@ -4506,7 +4899,7 @@ class TreetableMainRenderer {
     }
     ngOnInit() {
         fromEvent(window, 'resize')
-            .pipe(debounceTime$1(200))
+            .pipe(debounceTime(200))
             .subscribe(() => this.applyMaxWidth());
     }
     ngAfterContentInit() {
@@ -4595,6 +4988,159 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.6", ngImpor
                 args: [ClrTreetableColumn]
             }] } });
 
+/*
+ * Copyright (c) 2018-2025 Porsche Informatik. All Rights Reserved.
+ * This software is released under MIT license.
+ * The full license information can be found in LICENSE in the root directory of this project.
+ */
+class TreetableItemsDirective {
+    constructor() {
+        this._dataStateService = inject((TreetableDataStateService));
+        this._recursionService = inject((ClrTreetableRecursionService));
+        this._templateRef = inject((TemplateRef));
+        this.clrTtItemsOf = input.required();
+        this.clrTtItemsGetChildren = input.required();
+        if (this._templateRef) {
+            this._recursionService.setTemplate(this._templateRef);
+        }
+        effect(() => {
+            const items = this.clrTtItemsOf();
+            const getChildren = this.clrTtItemsGetChildren();
+            if (items) {
+                this._dataStateService.setDataSource(items, getChildren);
+            }
+        });
+    }
+    static ngTemplateContextGuard(
+    // @ts-expect-error This is a valid Angular context guard.
+    dir, 
+    // @ts-expect-error This is a valid Angular context guard.
+    ctx) {
+        return true;
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.6", ngImport: i0, type: TreetableItemsDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "19.2.6", type: TreetableItemsDirective, isStandalone: false, selector: "[clrTtItems][clrTtItemsOf]", inputs: { clrTtItemsOf: { classPropertyName: "clrTtItemsOf", publicName: "clrTtItemsOf", isSignal: true, isRequired: true, transformFunction: null }, clrTtItemsGetChildren: { classPropertyName: "clrTtItemsGetChildren", publicName: "clrTtItemsGetChildren", isSignal: true, isRequired: true, transformFunction: null } }, ngImport: i0 }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.6", ngImport: i0, type: TreetableItemsDirective, decorators: [{
+            type: Directive,
+            args: [{
+                    selector: '[clrTtItems][clrTtItemsOf]',
+                    standalone: false,
+                }]
+        }], ctorParameters: () => [] });
+
+/*
+ * Copyright (c) 2018-2025 Porsche Informatik. All Rights Reserved.
+ * This software is released under MIT license.
+ * The full license information can be found in LICENSE in the root directory of this project.
+ */
+const DEBOUNCE_TIME = 300;
+class ClrTreetableStringFilter {
+    constructor() {
+        this.smartToggleService = inject(ClrPopoverToggleService);
+        this.commonStrings = inject(ClrCommonStringsService);
+        this.elementRef = inject(ElementRef);
+        this.clrTtStringFilter = input.required();
+        this.clrTtFilterPlaceholder = input(this.commonStrings.keys.filterItems);
+        this.clrTtFilterLabel = input('');
+        this.clrTtFilterValue = model();
+        this._input = viewChild('input', { read: (ElementRef) });
+        this._textChange$ = new Subject();
+        this.filterLabel = computed(() => {
+            const label = this.clrTtFilterLabel();
+            if (label) {
+                return label;
+            }
+            const columnElement = this.elementRef.nativeElement?.closest('clr-tt-column');
+            const columnTitleElement = columnElement?.querySelector('.treetable-column-title');
+            return this.commonStrings.parse(this.commonStrings.keys.datagridFilterLabel, {
+                COLUMN: columnTitleElement?.textContent.trim() || '',
+            });
+        });
+        // Only emits the initial value once if it exists
+        this.initialValue$ = toObservable(this.clrTtFilterValue).pipe(take$1(1), filter$1(value => !!value));
+        this.changes = merge(this.initialValue$, this._textChange$).pipe(debounceTime$1(DEBOUNCE_TIME), tap(input => this.clrTtFilterValue.set(input)));
+        this.smartToggleService.openChange.pipe(takeUntilDestroyed()).subscribe(openChange => {
+            if (openChange) {
+                setTimeout(() => this._input()?.nativeElement.focus());
+            }
+        });
+    }
+    accepts(item) {
+        const filterValue = this.clrTtFilterValue();
+        if (!this.isActive() || !filterValue) {
+            return true;
+        }
+        return this.clrTtStringFilter()(item, filterValue.toLowerCase());
+    }
+    isActive() {
+        const value = this.clrTtFilterValue();
+        return !!value && value.length > 0;
+    }
+    clearFilter() {
+        this._textChange$.next('');
+    }
+    inputChanged(value) {
+        this._textChange$.next(value);
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.6", ngImport: i0, type: ClrTreetableStringFilter, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.2.0", version: "19.2.6", type: ClrTreetableStringFilter, isStandalone: false, selector: "clr-tt-string-filter", inputs: { clrTtStringFilter: { classPropertyName: "clrTtStringFilter", publicName: "clrTtStringFilter", isSignal: true, isRequired: true, transformFunction: null }, clrTtFilterPlaceholder: { classPropertyName: "clrTtFilterPlaceholder", publicName: "clrTtFilterPlaceholder", isSignal: true, isRequired: false, transformFunction: null }, clrTtFilterLabel: { classPropertyName: "clrTtFilterLabel", publicName: "clrTtFilterLabel", isSignal: true, isRequired: false, transformFunction: null }, clrTtFilterValue: { classPropertyName: "clrTtFilterValue", publicName: "clrTtFilterValue", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { clrTtFilterValue: "clrTtFilterValueChange" }, viewQueries: [{ propertyName: "_input", first: true, predicate: ["input"], descendants: true, read: ElementRef, isSignal: true }], ngImport: i0, template: `
+    <clr-tt-filter [clrTtFilter]="this">
+      <button
+        class="btn btn-sm btn-icon btn-link btn-trash"
+        data-testId="clrTtStringFilterClearBtn"
+        (click)="clearFilter()"
+      >
+        <cds-icon shape="trash"></cds-icon>
+      </button>
+      <clr-input-container>
+        <label for="filter">{{ filterLabel() }}</label>
+        <input
+          #input
+          clrInput
+          id="filter"
+          type="text"
+          name="search"
+          autocomplete="off"
+          data-testId="clrTtStringFilterInput"
+          [placeholder]="clrTtFilterPlaceholder()"
+          [ngModel]="clrTtFilterValue()"
+          (ngModelChange)="inputChanged($event)"
+        />
+      </clr-input-container>
+    </clr-tt-filter>
+  `, isInline: true, styles: [".btn-trash{position:absolute;top:10px;right:40px;padding:0}\n"], dependencies: [{ kind: "directive", type: i2.CdsIconCustomTag, selector: "cds-icon" }, { kind: "directive", type: i2.ClrLabel, selector: "label", inputs: ["id", "for"] }, { kind: "directive", type: i2.ClrInput, selector: "[clrInput]" }, { kind: "component", type: i2.ClrInputContainer, selector: "clr-input-container" }, { kind: "directive", type: i3$1.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i3$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i3$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: ClrTreetableFilter, selector: "clr-tt-filter", inputs: ["clrTtFilter"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.6", ngImport: i0, type: ClrTreetableStringFilter, decorators: [{
+            type: Component,
+            args: [{ selector: 'clr-tt-string-filter', template: `
+    <clr-tt-filter [clrTtFilter]="this">
+      <button
+        class="btn btn-sm btn-icon btn-link btn-trash"
+        data-testId="clrTtStringFilterClearBtn"
+        (click)="clearFilter()"
+      >
+        <cds-icon shape="trash"></cds-icon>
+      </button>
+      <clr-input-container>
+        <label for="filter">{{ filterLabel() }}</label>
+        <input
+          #input
+          clrInput
+          id="filter"
+          type="text"
+          name="search"
+          autocomplete="off"
+          data-testId="clrTtStringFilterInput"
+          [placeholder]="clrTtFilterPlaceholder()"
+          [ngModel]="clrTtFilterValue()"
+          (ngModelChange)="inputChanged($event)"
+        />
+      </clr-input-container>
+    </clr-tt-filter>
+  `, changeDetection: ChangeDetectionStrategy.OnPush, standalone: false, styles: [".btn-trash{position:absolute;top:10px;right:40px;padding:0}\n"] }]
+        }], ctorParameters: () => [] });
+
 /*
  * Copyright (c) 2018-2025 Porsche Informatik. All Rights Reserved.
  * This software is released under MIT license.
@@ -4612,8 +5158,13 @@ const CLR_TREETABLE_DIRECTIVES = [
     TreetableRowRenderer,
     TreetableCellRenderer,
     TreetableItemsDirective,
+    ClrTreetableFilter,
+    ClrTreetableStringFilter,
 ];
 class ClrTreetableModule {
+    constructor() {
+        ClarityIcons.addIcons(angleIcon, arrowIcon, ellipsisVerticalIcon, filterGridCircleIcon, filterGridIcon);
+    }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.6", ngImport: i0, type: ClrTreetableModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
     static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "19.2.6", ngImport: i0, type: ClrTreetableModule, declarations: [ClrTreetable,
             ClrTreetableRow,
@@ -4625,7 +5176,9 @@ class ClrTreetableModule {
             TreetableHeaderRenderer,
             TreetableRowRenderer,
             TreetableCellRenderer,
-            TreetableItemsDirective], imports: [CommonModule, ClarityModule, ReactiveFormsModule, FormsModule], exports: [ClrTreetable,
+            TreetableItemsDirective,
+            ClrTreetableFilter,
+            ClrTreetableStringFilter, ClrTreetableRecursiveRows, ClrTreetableRowCheckbox], imports: [CommonModule, ClarityModule, ReactiveFormsModule, FormsModule], exports: [ClrTreetable,
             ClrTreetableRow,
             ClrTreetableCell,
             ClrTreetableColumn,
@@ -4635,17 +5188,31 @@ class ClrTreetableModule {
             TreetableHeaderRenderer,
             TreetableRowRenderer,
             TreetableCellRenderer,
-            TreetableItemsDirective] }); }
+            TreetableItemsDirective,
+            ClrTreetableFilter,
+            ClrTreetableStringFilter] }); }
     static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "19.2.6", ngImport: i0, type: ClrTreetableModule, imports: [CommonModule, ClarityModule, ReactiveFormsModule, FormsModule] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.6", ngImport: i0, type: ClrTreetableModule, decorators: [{
             type: NgModule,
             args: [{
                     imports: [CommonModule, ClarityModule, ReactiveFormsModule, FormsModule],
-                    declarations: [CLR_TREETABLE_DIRECTIVES],
+                    declarations: [CLR_TREETABLE_DIRECTIVES, ClrTreetableRecursiveRows, ClrTreetableRowCheckbox],
                     exports: [CLR_TREETABLE_DIRECTIVES],
                 }]
-        }] });
+        }], ctorParameters: () => [] });
+
+/*
+ * Copyright (c) 2018-2025 Porsche Informatik. All Rights Reserved.
+ * This software is released under MIT license.
+ * The full license information can be found in LICENSE in the root directory of this project.
+ */
+
+/*
+ * Copyright (c) 2018-2025 Porsche Informatik. All Rights Reserved.
+ * This software is released under MIT license.
+ * The full license information can be found in LICENSE in the root directory of this project.
+ */
 
 /*
  * Copyright (c) 2018-2025 Porsche Informatik. All Rights Reserved.
@@ -4866,7 +5433,7 @@ class ClrHistoryService {
         return of(historyEntry).pipe(tap(() => this.changingHistory$.next(true)), switchMap(entry => this.historyHttpService.addHistoryEntry(entry)), tap(() => this.changingHistory$.next(false)));
     }
     getHistory(username, tenantId) {
-        return this.changingHistory$.pipe(filter$1(changing => !changing), switchMap(() => this.historyHttpService.getHistory(username, tenantId)));
+        return this.changingHistory$.pipe(filter$2(changing => !changing), switchMap(() => this.historyHttpService.getHistory(username, tenantId)));
     }
     removeFromHistory(historyEntry) {
         return of(historyEntry).pipe(tap(() => this.changingHistory$.next(true)), switchMap(entry => this.historyHttpService.removeFromHistory(entry)), tap(() => this.changingHistory$.next(false)));
@@ -11357,7 +11924,7 @@ class DatagridColumnReorderDirective {
         this.cdkDropList.sortPredicate = this.canBeSorted;
         this.cdkDropList.lockAxis = 'x';
         this.cdkDropList.dropped
-            .pipe(takeUntilDestroyed(this.destroyRef), filter$2(event => this.isDragItemDgColumn(event.item)))
+            .pipe(takeUntilDestroyed(this.destroyRef), filter$1(event => this.isDragItemDgColumn(event.item)))
             .subscribe(event => this.updateColumnOrder(event.previousIndex, event.currentIndex));
         // do not allow reordering columns when detail view is open (only one column is shown anyways)
         this.datagrid.detailService.stateChange
@@ -11616,7 +12183,7 @@ class StatePersistenceKeyDirective {
         this.reorderDirective.columnOrderChanged
             .pipe(takeUntil(this.destroy$), 
         // we skip the first value (init), because it's already coming from the local storage, so no need to save it again
-        filter$2(({ trigger }) => trigger !== 'init'))
+        filter$1(({ trigger }) => trigger !== 'init'))
             .subscribe(({ columns }) => this.persistColumnOrder(state, columns));
     }
     initColumnOrder(savedState) {
@@ -15023,5 +15590,5 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.6", ngImpor
  * Generated bundle index. Do not edit.
  */
 
-export { ACShape, AcceptanceDateShape, AcceptedBrands, AccessoryPartsShape, AudiBrandShape, AwardWinnerPremiumShape, BIG_ENDIAN, BlocksGroupForwardShape, BundleForwardShape, BusinessCustomersCommercialShape, BusinessCustomersPrivateShape, BusinessPartnerWithCar, CLR_BLANK_OPTION, CONTENT_PROVIDER, CalculatorForwardShape, CaliforniaServiceShape, CampaignOutdatedShape, CampaignShape, CarOffSite, CarOnSite, CircleFilled, CircleHalfFilled, CircleQuarterFilled, CircleThreeQuartersFilled, ClrActionPanel, ClrActionPanelContainer, ClrActionPanelContainerContent, ClrActionPanelContainerFooter, ClrActionPanelModule, ClrActiveNotification, ClrAddonsLabel, ClrAddonsModule, ClrAutocompleteOff, ClrAutocompleteOffModule, ClrBackButton, ClrBackButtonModule, ClrBrandAvatar, ClrBrandAvatarModule, ClrBreadcrumb, ClrBreadcrumbModule, ClrBreadcrumbService, ClrCollapseExpandSection, ClrCollapseExpandSectionModule, ClrContentPanel, ClrContentPanelContainer, ClrContentPanelContainerContent, ClrContentPanelContainerFooter, ClrContentPanelModule, ClrContentRef, ClrDataListPredefinedValidatorDirective, ClrDataListValidatorModule, ClrDataListValidators, ClrDatagridColumnReorderModule, ClrDatagridStatePersistenceModule, ClrDateFilterComponent, ClrDateFilterModule, ClrDateTimeContainer, ClrDateTimeModule, ClrDaterangeMaxValidator, ClrDaterangeMinValidator, ClrDaterangeOrderValidator, ClrDaterangeRequiredValidator, ClrDaterangepickerContainerComponent, ClrDaterangepickerDirective, ClrDaterangepickerModule, ClrDotPager, ClrDotPagerModule, ClrDropdownOverflowDirective, ClrDropdownOverflowModule, ClrEnumFilterComponent, ClrEnumFilterModule, ClrExportDatagridButtonModule, ClrFlowBar, ClrFlowBarModule, ClrFormModule, ClrGenericQuickList, ClrGenericQuickListModule, ClrHistory, ClrHistoryModule, ClrHistoryPinned, ClrHistoryService, ClrIfDaterangeErrorDirective, ClrIfWarning, ClrIfWarningModule, ClrLetterAvatar, ClrLetterAvatarModule, ClrLocationBarModule, ClrMainNavGroup, ClrMainNavGroupItem, ClrMainNavGroupModule, ClrMaxNumeric, ClrMinNumeric, ClrMultilingualInput, ClrMultilingualInputValidators, ClrMultilingualModule, ClrMultilingualSelector, ClrMultilingualTextarea, ClrNotification, ClrNotificationModule, ClrNotificationRef, ClrNotificationService, ClrNumericField, ClrNumericFieldModule, ClrNumericFieldValidators, ClrPagedSearchResultList, ClrPagedSearchResultListModule, ClrPager, ClrPagerModule, ClrProgressSpinnerComponent, ClrProgressSpinnerModule, ClrQuickList, ClrQuickListModule, ClrReadonlyDirective, ClrReadonlyDirectiveModule, ClrRequiredAllMultilang, ClrRequiredOneMultilang, ClrSearchField, ClrSearchFieldModule, ClrTimeInput, ClrTreetable, ClrTreetableActionOverflow, ClrTreetableCell, ClrTreetableColumn, ClrTreetableModule, ClrTreetablePlaceholder, ClrTreetableRow, ClrTreetableSortOrder, ClrViewEditSection, ClrViewEditSectionModule, ColumnHiddenStatePersistenceDirective, CompletedByDateShape, CupraBrandShape, Customer, CustomerVip, CustomerVipCollection, CustomerWaiting, CustomerWaitingCollection, DATE, DELIMITER_REGEX, DWABrandShape, DatagridColumnReorderDirective, DatagridFieldDirective, DayModel, DeliveryDate, DieselShape, DollarBillForwardShape, DollarBillPartialShape, DynamicCellContentComponent, EnergyShape, ExportDatagridButtonComponent, ExportDatagridService, ExportTypeEnum, ExternalPartForwardShape, FirstRegistrationDate, GasCarsServiceShape, GasShape, HISTORY_NOTIFICATION_URL_PROVIDER, HISTORY_PROVIDER, HISTORY_TOKEN, HistoryProvider, InternalPartForwardShape, InvoiceReadyShape, InvoiceRecipient, InvoiceShape, Items, ItemsForwardShape, ItemsReceiveShape, LITTLE_ENDIAN, LITTLE_ENDIAN_REGEX, LocationBarComponent, LocationBarContentProvider, LocationBarNode, LogoCommissionModule, LogoCommissionModuleFavIcon, LogoCommissionModuleNegative, LogoCommissionModuleNegativeFavIcon, LogoCostApproval, LogoCostApprovalFavIcon, LogoCostApprovalNegative, LogoCostApprovalNegativeFavIcon, LogoCostControlling, LogoCostControllingFavIcon, LogoCostControllingNegative, LogoCostControllingNegativeFavIcon, LogoDigitalServiceReception, LogoDigitalServiceReceptionFavIcon, LogoDigitalServiceReceptionNegative, LogoDigitalServiceReceptionNegativeFavIcon, LogoDocFlow, LogoDocFlowFavIcon, LogoDocFlowNegative, LogoDocFlowNegativeFavIcon, LogoDocScan, LogoDocScanFavIcon, LogoDocScanNegative, LogoDocScanNegativeFavIcon, LogoDocStore, LogoDocStoreFavIcon, LogoDocStoreNegative, LogoDocStoreNegativeFavIcon, LogoEBilling, LogoEBillingFavIcon, LogoEBillingNegative, LogoEBillingNegativeFavIcon, LogoEPayment, LogoEPaymentFavIcon, LogoEPaymentNegative, LogoEPaymentNegativeFavIcon, LogoMobilityPlanner, LogoMobilityPlannerFavIcon, LogoMobilityPlannerNegative, LogoMobilityPlannerNegativeFavIcon, LogoPartsMobile, LogoPartsMobileFavIcon, LogoPartsMobileNegative, LogoPartsMobileNegativeFavIcon, LogoSBO, LogoSBOFavIcon, LogoSBONegative, LogoSBONegativeFavIcon, LogoServiceCube, LogoServiceCubeFavIcon, LogoServiceCubeNegative, LogoServiceCubeNegativeFavIcon, LogoWCP, LogoWCPFavIcon, LogoWCPNegative, LogoWCPNegativeFavIcon, LogoWorkshopOrderTracker, LogoWorkshopOrderTrackerFavIcon, LogoWorkshopOrderTrackerNegative, LogoWorkshopOrderTrackerNegativeFavIcon, MIDDLE_ENDIAN, MIDDLE_ENDIAN_REGEX, MONTH, Mechanic, NewCarUtilityVehicleShape, NodeId, Number0, Number1, Number10, Number11, Number12, Number13, Number14, Number15, Number16, Number17, Number18, Number19, Number2, Number20, Number3, Number4, Number5, Number6, Number7, Number8, Number9, OrderShape, OrderStatusShape, PaintMaterialForwardShape, PaintMaterialShape, ParkingLocation, PartAvailabilityInfoShape, PartAvailabilityNoShape, PartAvailabilityUnknownShape, PartAvailabilityWarningShape, PartAvailabilityYesShape, PartIdenticalPredecessorShape, PartIdenticalShape, PartIdenticalSuccessorShape, PartIdenticalSuccpredecessorShape, PartNonStockForwardShape, PartPredecessorShape, PartSuccessorPredecessorShape, PartSuccessorShape, PartsChangelocation, PartsForwardShape, PartsInventory, PartsNonStockShape, PartsPicking, PartsPickingPlus, PartsReceiving, PartsShape, PlusServiceShape, PopoverPositions, PorscheBrandShape, PriceTypeSwitchShape, RepeatRepairCollection, RepeatRepairShape, ReplacementVehicleCollection, ReplacementVehicleShape, ReturnDateShape, SEPARATOR_TEXT_DEFAULT, SeatBrandShape, Selection, ServiceAdvisor, SkodaBrandShape, Sort, StatePersistenceKeyDirective, TRANSLATIONS, TaskAndAppointment, TextForward, TimeModel, TopcardShape, TouaregServiceShape, TreetableCellRenderer, TreetableHeaderRenderer, TreetableItemsDirective, TreetableMainRenderer, TreetableRowRenderer, USER_INPUT_REGEX, VWBrandShape, VWNBrandShape, VWShape, VehicleConversionShape, VinShape, VsfSearchShape, VsfSearchShape48, WCPShape, WrenchForward, YEAR, acceleration, accelerationIcon, acceptanceDateIcon, accessories, accessoriesIcon, accessoryPartsIcon, adblueAppIcon, adblue_app, add, addIcon, airConditionerIcon, air_conditioning, alert, alertFilledAppIcon, alertIcon, alertNotificationFilledAppIcon, alert_filled_app, alert_notification_filled_app, allIcons, ambientLightAppIcon, ambient_light_app, amplifier, amplifierIcon, appConnectAppIcon, app_connect_app, archive, archiveIcon, arrowDownIcon, arrowLeftAlignedAppIcon, arrowLeftIcon, arrowRightIcon, arrowSliderAppIcon, arrowUpIcon, arrow_down, arrow_left, arrow_left_aligned_app, arrow_right, arrow_slider_app, arrow_up, attachment, attachmentIcon, audiBrandIcon, authentPlugChargeAppIcon, authentQrAppIcon, authentRfidAppIcon, authentTouchidAppIcon, authent_plug_charge_app, authent_qr_app, authent_rfid_app, authent_touch_id_app, automaticTempAppIcon, automatic_temp_app, awardWinnerPremiumIcon, award_winner_premium, back, backIcon, battery, batteryIcon, batterySocChargingAppIcon, batterySocDepartureAppIcon, batterySocDestinationAppIcon, battery_soc_charging_app, battery_soc_departure_app, battery_soc_destination_app, bin, binIcon, blocksGroupForwardIcon, bluetooth, bluetoothIcon, bookmark, bookmarkFilledIcon, bookmarkIcon, bookmark_filled, brakeAppIcon, brake_app, brochure, brochureIcon, bulletpointAppIcon, bulletpoint_app, bundleForwardIcon, businessCustomersCommercialIcon, businessCustomersPrivateIcon, businessPartnerWithCarIcon, business_customers_commercial, business_customers_private, calc, calcIcon, calculatorForwardIcon, calendar, calendarCustomIcon, californiaServiceIcon, californiaSpecialistIcon, california_specialist, cameraScanIcon, camera_scan, campaignIcon, campaignOutdatedIcon, carDocumentsIcon, carErrorAppIcon, carInsuranceIcon, carOffSite, carOnSite, carPickupServiceIcon, carPlusIcon, carSettingsIcon, carVerifiedAppIcon, carWashIcon, carWheelAppIcon, car_documents, car_error_app, car_insurance, car_pickup_service, car_plus, car_settings, car_verified_app, car_wheel_app, carwash, certifiedRepairIcon, certifiedRetailerIcon, certified_repair, certified_retailer, challengeAppIcon, challenge_app, charging, chargingIcon, chargingPduAppIcon, chargingStationIcon, chargingTarifOverviewAppIcon, charging_pdu_app, charging_station, charging_tarif_overview_app, chat, chatAppIcon, chatIcon, chat_app, checkboxCheckedAppIcon, checkboxCheckedIcon, checkboxUncheckedAppIcon, checkboxUncheckedIcon, checkbox_checked, checkbox_checked_app, checkbox_unchecked, checkbox_unchecked_app, checkmark, checkmarkAppIcon, checkmarkFilledAppIcon, checkmarkIcon, checkmark_app, checkmark_filled_app, chevronDownIcon, chevronLeftAlignedappIcon, chevronLeftIcon, chevronRightAlignedappIcon, chevronRightIcon, chevronSmallLeftAlignedappIcon, chevronSmallRightAlignedappIcon, chevronUpIcon, chevron_down, chevron_left, chevron_left_alignedapp, chevron_right, chevron_right_alignedapp, chevron_small_left_alignedapp, chevron_small_right_alignedapp, chevron_up, circleFilledIcon, circleHalfFilledIcon, circleQuarterFilledIcon, circleThreeQuartersFilledIcon, city, cityIcon, clearAppIcon, clearRightAlignedappIcon, clear_app, clear_right_alignedapp, clock, clockIcon, close, closeAppIcon, closeCircleIcon, closeIcon, closeLeftAlignedappIcon, closeRightAlignedappIcon, close_app, close_circle, close_left_alignedapp, close_right_alignedapp, clrIconSVG, coffeeFilledAppIcon, coffee_filled_app, compassAppIcon, compass_app, completedByDateIcon, configuratorCommercialIcon, configuratorPrivateIcon, configurator_commercial, configurator_private, construction, constructionIcon, consumptionFuelFilledAppIcon, consumptionIcon, consumption_fuel, consumption_fuel_filled_app, contact, contactDealerFilledAppIcon, contactDealerIcon, contactIcon, contact_dealer, contact_dealer_filled_app, countryRoadIcon, country_road, craft, craftIcon, cupraBrandIcon, customerIcon, customerVipIcon, customerWaitingIcon, customersCenterIcon, customers_center, dataCopyAppIcon, dataExpiredIcon, dataFilledIcon, dataInputIcon, dataPlugAppIcon, dataSearchIcon, dataTimeExtensionIcon, data_copy_app, data_expired, data_filled, data_input, data_plug_app, data_search, data_time_extension, defogDefrostAutoAppIcon, defogDefrostIcon, defog_defrost, defog_defrost_auto_app, deliveryDateIcon, destinationAppIcon, destination_app, dieselIcon, direction, directionIcon, dischargingAppIcon, discharging_app, discountAppIcon, discount_app, discoveryAppIcon, discovery_app, dollarBillForwardIcon, dollarBillPartialIcon, download, downloadCustomIcon, dragIndicatorIcon, drag_indicator, driversAssistanceIcon, drivers_assistance, dropFilledAppIcon, drop_filled_app, dwaBrandIcon, eco, ecoIcon, edit, editIcon, editSmallRightAlignedAppIcon, edit_small_right_aligned_app, efficiency, efficiencyIcon, electricCarsIcon, electricCarsServiceIcon, electric_cars, electric_cars_service, electricity, electricityFilledAppIcon, electricityIcon, electricity_filled_app, emergency, emergencyIcon, emission, emissionIcon, energyIcon, engine, engineIcon, entertainment, entertainmentIcon, escapeHtml, escapeRegex, exportAppIcon, export_app, expressServiceIcon, express_service, exterior, exterior360Icon, exteriorIcon, exterior_360, externalPartForwardIcon, faq, faqIcon, fastForwardIcon, fast_forward, fax, faxIcon, filter, filterIcon, findACarIcon, findADealerIcon, find_a_car, find_a_dealer, firstRegistrationDateIcon, fleetServiceCommercialIcon, fleetServicePrivateIcon, fleet_service_commercial, fleet_service_private, folderFilledAppIcon, folder_filled_app, foodFilledAppIcon, food_filled_app, formatNumber, fullscreenEnterIcon, fullscreenExitIcon, fullscreen_enter, fullscreen_exit, gallery, galleryIcon, garageAppIcon, garage_app, gasAppIcon, gasCarsServiceIcon, gasIcon, gas_app, glassDamageAppIcon, glass_damage_app, gte, gteIcon, heart, heartFilledAppIcon, heartIcon, heart_filled_app, heightAppIcon, height_app, highwayRoadIcon, highway_road, history, historyIcon, homeAppIcon, homeEnergyAppIcon, homeFilledAppIcon, home_app, home_energy_app, home_filled_app, hornAppIcon, hornFilledAppIcon, horn_app, horn_filled_app, hybrid, hybridIcon, immediateChargingAppIcon, immediate_charging_app, info, infoFilledIcon, infoIcon, info_filled, inputHideIcon, inputShowIcon, input_hide, input_show, interior, interior360Icon, interiorIcon, interior_360, internalPartForwardIcon, internet, internetIcon, invitationAppIcon, invitation_app, invoiceIcon, invoiceReadyIcon, invoiceRecipientIcon, itemsForwardIcon, itemsRecieveIcon, jobportal, jobportalIcon, keyAppIcon, keyCardAppIcon, keyDigitalAppIcon, key_app, key_card_app, key_digital_app, keyboardAppIcon, keyboard_app, layerCollapseAppIcon, layerExpandAppIcon, layer_collapse_app, layer_expand_app, layersAppIcon, layers_app, legalTermsAndConditionsAppIcon, legal_terms_and_conditions_app, licencePlateAppIcon, licence_plate_app, lightAssistappIcon, light_assistapp, lightingAppIcon, lighting_app, linkExternAppIcon, link_extern_app, list, listIcon, loadingVolumeIcon, loading_volume, localBusinessIcon, local_business, locate, locateIcon, lock, lockIcon, lockOpenIcon, lock_open, login, loginIcon, logistic, logisticIcon, logoCommissionModuleFavIcon, logoCommissionModuleIcon, logoCommissionModuleNegativeFavIcon, logoCommissionModuleNegativeIcon, logoCostApprovalFavIcon, logoCostApprovalIcon, logoCostApprovalNegativeFavIcon, logoCostApprovalNegativeIcon, logoCrossControllingFavIcon, logoCrossControllingIcon, logoCrossControllingNegativeFavIcon, logoCrossControllingNegativeIcon, logoDigitalServiceReceptionFavIcon, logoDigitalServiceReceptionIcon, logoDigitalServiceReceptionNegativeFavIcon, logoDigitalServiceReceptionNegativeIcon, logoDocFlowFavIcon, logoDocFlowIcon, logoDocFlowNegativeFavIcon, logoDocFlowNegativeIcon, logoDocScanFavIcon, logoDocScanIcon, logoDocScanNegativeFavIcon, logoDocScanNegativeIcon, logoDocStoreFavIcon, logoDocStoreIcon, logoDocStoreNegativeFavIcon, logoDocStoreNegativeIcon, logoEBillingFavIcon, logoEBillingIcon, logoEBillingNegativeFavIcon, logoEBillingNegativeIcon, logoEPaymentFavIcon, logoEPaymentIcon, logoEPaymentNegativeFavIcon, logoEPaymentNegativeIcon, logoMobilityPlannerFavIcon, logoMobilityPlannerIcon, logoMobilityPlannerNegativeFavIcon, logoMobilityPlannerNegativeIcon, logoPartsMobileFavIcon, logoPartsMobileIcon, logoPartsMobileNegativeFavIcon, logoPartsMobileNegativeIcon, logoSBOFavIcon, logoSBOIcon, logoSBONegativeFavIcon, logoSBONegativeIcon, logoServiceCubeFavIcon, logoServiceCubeIcon, logoServiceCubeNegativeFavIcon, logoServiceCubeNegativeIcon, logoWCPFavIcon, logoWCPIcon, logoWCPNegativeFavIcon, logoWCPNegativeIcon, logoWorkshopOrderTrackerFavIcon, logoWorkshopOrderTrackerIcon, logoWorkshopOrderTrackerNegativeFavIcon, logoWorkshopOrderTrackerNegativeIcon, logout, logoutIcon, magnifier, magnifierIcon, magnifierMinusIcon, magnifierPlusIcon, magnifier_minus, magnifier_plus, mail, mailIcon, mailResendAppIcon, mail_resend_app, manual, manualIcon, map, mapIcon, mechanicIcon, media, mediaIcon, menu, menuAppAppIcon, menuIcon, menu_app_app, microphoneAppIcon, microphone_app, mobile, mobileIcon, moreAppIcon, moreAppbarAppIcon, more_app, more_appbar_app, mot, motIcon, motability, motabilityIcon, navigate, navigateFilledAppIcon, navigateIcon, navigate_filled_app, newCarCommercialIcon, newCarPrivateFilledAppIcon, newCarPrivateIcon, newCarUtilityVehicleIcon, new_car_commercial, new_car_private, new_car_private_filled_app, nightServiceIcon, night_service, notification, notificationFilledIcon, notificationIcon, notification_filled, number0Icon, number10Icon, number11Icon, number12Icon, number13Icon, number14Icon, number15Icon, number16Icon, number17Icon, number18Icon, number19Icon, number1Icon, number20Icon, number2Icon, number3Icon, number4Icon, number5Icon, number6Icon, number7Icon, number8Icon, number9Icon, offers, offersFilledAppIcon, offersIcon, offers_filled_app, officeAppIcon, officeFilledAppIcon, office_app, office_filled_app, oilLevelIcon, oilLevelWarningIcon, oilTemperatureAppIcon, oil_level, oil_level_warning, oil_temperature_app, onCallDutyIcon, on_call_duty, openSatIcon, open_sat, orderIcon, orderStatusIcon, paintMaterialForwardIcon, paintMaterialIcon, paintShopIcon, paint_shop, paragraphAppIcon, paragraph_app, parkHeaterAppIcon, park_heater_app, parking, parkingFilledAppIcon, parkingGarageAppIcon, parkingIcon, parkingLocationIcon, parkingRouteAppIcon, parkingValetAppIcon, parking_filled_app, parking_garage_app, parking_route_app, parking_valet_app, partAvailabilityInfoIcon, partAvailabilityNoIcon, partAvailabilityUnknownIcon, partAvailabilityWarningIcon, partAvailabilityYesIcon, partIdenticalIcon, partIdenticalPredecessorIcon, partIdenticalSuccessorIcon, partIdenticalSuccpredecessorIcon, partPredecessorIcon, partSuccessorIcon, partSuccessorPredecessorIcon, partsChangelocationIcon, partsForwardIcon, partsIcon, partsInventoryIcon, partsNonStockForwardIcon, partsNonStockIcon, partsPickingIcon, partsPickingPlusIcon, partsReceivingIcon, pause, pauseIcon, payload, payloadIcon, paymentAppIcon, paymentCashAppIcon, paymentChargingCardAppIcon, paymentCreditcardAppIcon, paymentMachineAppIcon, payment_app, payment_cash_app, payment_charging_card_app, payment_creditcard_app, payment_machine_app, performance, performanceIcon, petrol, petrolIcon, phone, phoneIcon, pin, pinFilledAppIcon, pinGenericFilledAppIcon, pinIcon, pin_filled_app, pin_generic_filled_app, play, playIcon, plugCcsAppIcon, plugChademoAppIcon, plugChargeAppIcon, plugGenericAppIcon, plugSchukoAppIcon, plugType1AppIcon, plugType2AppIcon, plug_ccs_app, plug_chademo_app, plug_charge_app, plug_generic_app, plug_schuko_app, plug_type1_app, plug_type2_app, plusServiceIcon, porscheBrandIcon, power, powerIcon, powerTrainIcon, powertrain, preHeaterAppIcon, pre_heater_app, preciseLaneNavigationAppIcon, precise_lane_navigation_app, presentAppIcon, present_app, priceTypeSwitchIcon, printer, printerIcon, privacyAppIcon, privacy_app, profile, profileIcon, profileRegisterAppIcon, profileVerifiedIcon, profile_register_app, profile_verified, publicServiceIcon, publicTransportAppIcon, public_service, public_transport_app, qualifiedWorkshopIcon, qualified_workshop, questionnaireAppIcon, questionnaire_app, radio, radioButtonInselectedIcon, radioButtonSelectedForDefIcon, radioButtonSelectedIcon, radioIcon, radio_button_inselected, radio_button_selected, radio_button_selected_for_development, range, rangeIcon, reload, reloadIcon, remove, removeIcon, repeat, repeatIcon, repeatRepairIcon, replacementVehicleIcon, returnDateIcon, rewind, rewindIcon, roadsideAssistanceIcon, roadside_assistance, route, routeArrowAppIcon, routeIcon, route_arrow_app, routesHistoryAppIcon, routes_history_app, rss, rssIcon, safety, safetyIcon, save, saveAppIcon, saveIcon, save_app, seat, seatAirIcon, seatBrandIcon, seatIcon, seat_air, secretTipAppIcon, secretTipFilledAppIcon, secret_tip_app, secret_tip_filled_app, selected, selectedIcon, selectedPartnerNetworkAppIcon, selected_partner_network_app, sendToCarAppIcon, send_to_car_app, service, serviceAdvisorIcon, serviceBellIcon, serviceFilledAppIcon, serviceIcon, service_bell, service_filled_app, settings, settingsIcon, shareAndroidIcon, shareIosIcon, share_android, share_ios, shoppingCartFilledAppIcon, shoppingCartIcon, shopping_cart, shopping_cart_filled_app, shuffle, shuffleIcon, size, sizeIcon, skillAppIcon, skill_app, skipBackwardIcon, skipForwardIcon, skip_backward, skip_forward, skodaBrandIcon, softwareDownloadAppIcon, software_download_app, sortingAppIcon, sorting_app, sound, soundIcon, standardEquipmentIcon, standard_equipment, starFilledIcon, starOutlineIcon, star_filled, star_outline, statisticAppIcon, statistic_app, stockLocatorCommercialIcon, stockLocatorPrivateIcon, stock_locator_commercial, stock_locator_private, stop, stopIcon, strip, switchPositionAppIcon, switch_position_app, syncAppIcon, sync_app, taskAndAppointmentIcon, taxiDealerIcon, taxi_dealer, technicalSpecificationIcon, technical_specification, temperatureAppIcon, temperature_app, testDriveIcon, test_drive, textForwardIcon, thumbsdownAppIcon, thumbsdownFilledAppIcon, thumbsdown_app, thumbsdown_filled_app, thumbsupAppIcon, thumbsupFilledAppIcon, thumbsup_app, thumbsup_filled_app, timeClimatisationAppIcon, timePreferredAppIcon, time_climatisation_app, time_preferred_app, timer, timerIcon, topcardIcon, touaregServiceIcon, transcriptDownloadIcon, transcript_download, transmissionAutomaticIcon, transmissionManualIcon, transmission_automatic, transmission_manual, tripAppIcon, tripLongAppIcon, tripPartedAppIcon, tripShortAppIcon, trip_app, trip_long_app, trip_parted_app, trip_short_app, turnSignalsIcon, turn_signals, unselected, unselectedIcon, updateRefreshAppIcon, update_refresh_app, upload, uploadAppIcon, uploadCustomIcon, upload_app, usedCarCommercialIcon, usedCarPrivateIcon, used_car_commercial, used_car_private, vehicleAmarokIcon, vehicleCaddyIcon, vehicleConversionIcon, vehicleCrafterIcon, vehicleHightIcon, vehicleIdBuzzIcon, vehicleMultivanIcon, vehicleTransporterIcon, vehicle_amarok, vehicle_caddy, vehicle_crafter, vehicle_hight, vehicle_idbuzz, vehicle_multivan, vehicle_transporter, videoChatIcon, video_chat, view360Icon, view_360, vinIcon, virtualRealityIcon, virtual_reality, voiceMessageAppIcon, voice_message_app, volkswagenAppIcon, volkswagenIcon, volkswagen_app, volumeMaximumIcon, volumeMediumIcon, volumeMuteIcon, volume_maximum, volume_medium, volume_mute, vsfSearch48Icon, vsfSearchIcon, vwBrandIcon, vwConnectLicenseAppIcon, vw_connect_license_app, vwnBrandIcon, walkingAppIcon, walkingFilledAppIcon, walking_app, walking_filled_app, wallbox, wallboxIcon, wcAppIcon, wc_app, wcpIcon, weAssistAppIcon, weChargeAppIcon, weDeliverAppIcon, weExperienceAppIcon, weParkAppIcon, weUpgradeAppIcon, we_assist_app, we_charge_app, we_deliver_app, we_experience_app, we_park_app, we_upgrade_app, weatherSunAppIcon, weather_sun_app, wheelToWheelIcon, wheel_to_wheel, windscreenWashIcon, windscreen_wash, wlanHotspotIcon, wlan_hotspot, wrenchForwardIcon };
+export { ACShape, AcceptanceDateShape, AcceptedBrands, AccessoryPartsShape, AudiBrandShape, AwardWinnerPremiumShape, BIG_ENDIAN, BlocksGroupForwardShape, BundleForwardShape, BusinessCustomersCommercialShape, BusinessCustomersPrivateShape, BusinessPartnerWithCar, CLR_BLANK_OPTION, CONTENT_PROVIDER, CalculatorForwardShape, CaliforniaServiceShape, CampaignOutdatedShape, CampaignShape, CarOffSite, CarOnSite, CircleFilled, CircleHalfFilled, CircleQuarterFilled, CircleThreeQuartersFilled, ClrActionPanel, ClrActionPanelContainer, ClrActionPanelContainerContent, ClrActionPanelContainerFooter, ClrActionPanelModule, ClrActiveNotification, ClrAddonsLabel, ClrAddonsModule, ClrAutocompleteOff, ClrAutocompleteOffModule, ClrBackButton, ClrBackButtonModule, ClrBrandAvatar, ClrBrandAvatarModule, ClrBreadcrumb, ClrBreadcrumbModule, ClrBreadcrumbService, ClrCollapseExpandSection, ClrCollapseExpandSectionModule, ClrContentPanel, ClrContentPanelContainer, ClrContentPanelContainerContent, ClrContentPanelContainerFooter, ClrContentPanelModule, ClrContentRef, ClrDataListPredefinedValidatorDirective, ClrDataListValidatorModule, ClrDataListValidators, ClrDatagridColumnReorderModule, ClrDatagridStatePersistenceModule, ClrDateFilterComponent, ClrDateFilterModule, ClrDateTimeContainer, ClrDateTimeModule, ClrDaterangeMaxValidator, ClrDaterangeMinValidator, ClrDaterangeOrderValidator, ClrDaterangeRequiredValidator, ClrDaterangepickerContainerComponent, ClrDaterangepickerDirective, ClrDaterangepickerModule, ClrDotPager, ClrDotPagerModule, ClrDropdownOverflowDirective, ClrDropdownOverflowModule, ClrEnumFilterComponent, ClrEnumFilterModule, ClrExportDatagridButtonModule, ClrFlowBar, ClrFlowBarModule, ClrFormModule, ClrGenericQuickList, ClrGenericQuickListModule, ClrHistory, ClrHistoryModule, ClrHistoryPinned, ClrHistoryService, ClrIfDaterangeErrorDirective, ClrIfWarning, ClrIfWarningModule, ClrLetterAvatar, ClrLetterAvatarModule, ClrLocationBarModule, ClrMainNavGroup, ClrMainNavGroupItem, ClrMainNavGroupModule, ClrMaxNumeric, ClrMinNumeric, ClrMultilingualInput, ClrMultilingualInputValidators, ClrMultilingualModule, ClrMultilingualSelector, ClrMultilingualTextarea, ClrNotification, ClrNotificationModule, ClrNotificationRef, ClrNotificationService, ClrNumericField, ClrNumericFieldModule, ClrNumericFieldValidators, ClrPagedSearchResultList, ClrPagedSearchResultListModule, ClrPager, ClrPagerModule, ClrProgressSpinnerComponent, ClrProgressSpinnerModule, ClrQuickList, ClrQuickListModule, ClrReadonlyDirective, ClrReadonlyDirectiveModule, ClrRequiredAllMultilang, ClrRequiredOneMultilang, ClrSearchField, ClrSearchFieldModule, ClrTimeInput, ClrTreetable, ClrTreetableActionOverflow, ClrTreetableCell, ClrTreetableColumn, ClrTreetableFilter, ClrTreetableModule, ClrTreetablePlaceholder, ClrTreetableRow, ClrTreetableSortOrder, ClrTreetableStringFilter, ClrTreetableTreeNode, ClrViewEditSection, ClrViewEditSectionModule, ColumnHiddenStatePersistenceDirective, CompletedByDateShape, CupraBrandShape, Customer, CustomerVip, CustomerVipCollection, CustomerWaiting, CustomerWaitingCollection, DATE, DELIMITER_REGEX, DWABrandShape, DatagridColumnReorderDirective, DatagridFieldDirective, DayModel, DeliveryDate, DieselShape, DollarBillForwardShape, DollarBillPartialShape, DynamicCellContentComponent, EnergyShape, ExportDatagridButtonComponent, ExportDatagridService, ExportTypeEnum, ExternalPartForwardShape, FirstRegistrationDate, GasCarsServiceShape, GasShape, HISTORY_NOTIFICATION_URL_PROVIDER, HISTORY_PROVIDER, HISTORY_TOKEN, HistoryProvider, InternalPartForwardShape, InvoiceReadyShape, InvoiceRecipient, InvoiceShape, ItemsForwardShape, ItemsReceiveShape, LITTLE_ENDIAN, LITTLE_ENDIAN_REGEX, LocationBarComponent, LocationBarContentProvider, LocationBarNode, LogoCommissionModule, LogoCommissionModuleFavIcon, LogoCommissionModuleNegative, LogoCommissionModuleNegativeFavIcon, LogoCostApproval, LogoCostApprovalFavIcon, LogoCostApprovalNegative, LogoCostApprovalNegativeFavIcon, LogoCostControlling, LogoCostControllingFavIcon, LogoCostControllingNegative, LogoCostControllingNegativeFavIcon, LogoDigitalServiceReception, LogoDigitalServiceReceptionFavIcon, LogoDigitalServiceReceptionNegative, LogoDigitalServiceReceptionNegativeFavIcon, LogoDocFlow, LogoDocFlowFavIcon, LogoDocFlowNegative, LogoDocFlowNegativeFavIcon, LogoDocScan, LogoDocScanFavIcon, LogoDocScanNegative, LogoDocScanNegativeFavIcon, LogoDocStore, LogoDocStoreFavIcon, LogoDocStoreNegative, LogoDocStoreNegativeFavIcon, LogoEBilling, LogoEBillingFavIcon, LogoEBillingNegative, LogoEBillingNegativeFavIcon, LogoEPayment, LogoEPaymentFavIcon, LogoEPaymentNegative, LogoEPaymentNegativeFavIcon, LogoMobilityPlanner, LogoMobilityPlannerFavIcon, LogoMobilityPlannerNegative, LogoMobilityPlannerNegativeFavIcon, LogoPartsMobile, LogoPartsMobileFavIcon, LogoPartsMobileNegative, LogoPartsMobileNegativeFavIcon, LogoSBO, LogoSBOFavIcon, LogoSBONegative, LogoSBONegativeFavIcon, LogoServiceCube, LogoServiceCubeFavIcon, LogoServiceCubeNegative, LogoServiceCubeNegativeFavIcon, LogoWCP, LogoWCPFavIcon, LogoWCPNegative, LogoWCPNegativeFavIcon, LogoWorkshopOrderTracker, LogoWorkshopOrderTrackerFavIcon, LogoWorkshopOrderTrackerNegative, LogoWorkshopOrderTrackerNegativeFavIcon, MIDDLE_ENDIAN, MIDDLE_ENDIAN_REGEX, MONTH, Mechanic, NewCarUtilityVehicleShape, NodeId, Number0, Number1, Number10, Number11, Number12, Number13, Number14, Number15, Number16, Number17, Number18, Number19, Number2, Number20, Number3, Number4, Number5, Number6, Number7, Number8, Number9, OrderShape, OrderStatusShape, PaintMaterialForwardShape, PaintMaterialShape, ParkingLocation, PartAvailabilityInfoShape, PartAvailabilityNoShape, PartAvailabilityUnknownShape, PartAvailabilityWarningShape, PartAvailabilityYesShape, PartIdenticalPredecessorShape, PartIdenticalShape, PartIdenticalSuccessorShape, PartIdenticalSuccpredecessorShape, PartNonStockForwardShape, PartPredecessorShape, PartSuccessorPredecessorShape, PartSuccessorShape, PartsChangelocation, PartsForwardShape, PartsInventory, PartsNonStockShape, PartsPicking, PartsPickingPlus, PartsReceiving, PartsShape, PlusServiceShape, PopoverPositions, PorscheBrandShape, PriceTypeSwitchShape, RepeatRepairCollection, RepeatRepairShape, ReplacementVehicleCollection, ReplacementVehicleShape, ReturnDateShape, SEPARATOR_TEXT_DEFAULT, SeatBrandShape, ServiceAdvisor, SkodaBrandShape, Sort, StatePersistenceKeyDirective, TRANSLATIONS, TaskAndAppointment, TextForward, TimeModel, TopcardShape, TouaregServiceShape, TreetableCellRenderer, TreetableDataStateService, TreetableHeaderRenderer, TreetableItemsDirective, TreetableMainRenderer, TreetableRowRenderer, USER_INPUT_REGEX, VWBrandShape, VWNBrandShape, VWShape, VehicleConversionShape, VinShape, VsfSearchShape, VsfSearchShape48, WCPShape, WrenchForward, YEAR, acceleration, accelerationIcon, acceptanceDateIcon, accessories, accessoriesIcon, accessoryPartsIcon, adblueAppIcon, adblue_app, add, addIcon, airConditionerIcon, air_conditioning, alert, alertFilledAppIcon, alertIcon, alertNotificationFilledAppIcon, alert_filled_app, alert_notification_filled_app, allIcons, ambientLightAppIcon, ambient_light_app, amplifier, amplifierIcon, appConnectAppIcon, app_connect_app, archive, archiveIcon, arrowDownIcon, arrowLeftAlignedAppIcon, arrowLeftIcon, arrowRightIcon, arrowSliderAppIcon, arrowUpIcon, arrow_down, arrow_left, arrow_left_aligned_app, arrow_right, arrow_slider_app, arrow_up, attachment, attachmentIcon, audiBrandIcon, authentPlugChargeAppIcon, authentQrAppIcon, authentRfidAppIcon, authentTouchidAppIcon, authent_plug_charge_app, authent_qr_app, authent_rfid_app, authent_touch_id_app, automaticTempAppIcon, automatic_temp_app, awardWinnerPremiumIcon, award_winner_premium, back, backIcon, battery, batteryIcon, batterySocChargingAppIcon, batterySocDepartureAppIcon, batterySocDestinationAppIcon, battery_soc_charging_app, battery_soc_departure_app, battery_soc_destination_app, bin, binIcon, blocksGroupForwardIcon, bluetooth, bluetoothIcon, bookmark, bookmarkFilledIcon, bookmarkIcon, bookmark_filled, brakeAppIcon, brake_app, brochure, brochureIcon, bulletpointAppIcon, bulletpoint_app, bundleForwardIcon, businessCustomersCommercialIcon, businessCustomersPrivateIcon, businessPartnerWithCarIcon, business_customers_commercial, business_customers_private, calc, calcIcon, calculatorForwardIcon, calendar, calendarCustomIcon, californiaServiceIcon, californiaSpecialistIcon, california_specialist, cameraScanIcon, camera_scan, campaignIcon, campaignOutdatedIcon, carDocumentsIcon, carErrorAppIcon, carInsuranceIcon, carOffSite, carOnSite, carPickupServiceIcon, carPlusIcon, carSettingsIcon, carVerifiedAppIcon, carWashIcon, carWheelAppIcon, car_documents, car_error_app, car_insurance, car_pickup_service, car_plus, car_settings, car_verified_app, car_wheel_app, carwash, certifiedRepairIcon, certifiedRetailerIcon, certified_repair, certified_retailer, challengeAppIcon, challenge_app, charging, chargingIcon, chargingPduAppIcon, chargingStationIcon, chargingTarifOverviewAppIcon, charging_pdu_app, charging_station, charging_tarif_overview_app, chat, chatAppIcon, chatIcon, chat_app, checkboxCheckedAppIcon, checkboxCheckedIcon, checkboxUncheckedAppIcon, checkboxUncheckedIcon, checkbox_checked, checkbox_checked_app, checkbox_unchecked, checkbox_unchecked_app, checkmark, checkmarkAppIcon, checkmarkFilledAppIcon, checkmarkIcon, checkmark_app, checkmark_filled_app, chevronDownIcon, chevronLeftAlignedappIcon, chevronLeftIcon, chevronRightAlignedappIcon, chevronRightIcon, chevronSmallLeftAlignedappIcon, chevronSmallRightAlignedappIcon, chevronUpIcon, chevron_down, chevron_left, chevron_left_alignedapp, chevron_right, chevron_right_alignedapp, chevron_small_left_alignedapp, chevron_small_right_alignedapp, chevron_up, circleFilledIcon, circleHalfFilledIcon, circleQuarterFilledIcon, circleThreeQuartersFilledIcon, city, cityIcon, clearAppIcon, clearRightAlignedappIcon, clear_app, clear_right_alignedapp, clock, clockIcon, close, closeAppIcon, closeCircleIcon, closeIcon, closeLeftAlignedappIcon, closeRightAlignedappIcon, close_app, close_circle, close_left_alignedapp, close_right_alignedapp, clrIconSVG, coffeeFilledAppIcon, coffee_filled_app, compassAppIcon, compass_app, completedByDateIcon, configuratorCommercialIcon, configuratorPrivateIcon, configurator_commercial, configurator_private, construction, constructionIcon, consumptionFuelFilledAppIcon, consumptionIcon, consumption_fuel, consumption_fuel_filled_app, contact, contactDealerFilledAppIcon, contactDealerIcon, contactIcon, contact_dealer, contact_dealer_filled_app, countryRoadIcon, country_road, craft, craftIcon, cupraBrandIcon, customerIcon, customerVipIcon, customerWaitingIcon, customersCenterIcon, customers_center, dataCopyAppIcon, dataExpiredIcon, dataFilledIcon, dataInputIcon, dataPlugAppIcon, dataSearchIcon, dataTimeExtensionIcon, data_copy_app, data_expired, data_filled, data_input, data_plug_app, data_search, data_time_extension, defogDefrostAutoAppIcon, defogDefrostIcon, defog_defrost, defog_defrost_auto_app, deliveryDateIcon, destinationAppIcon, destination_app, dieselIcon, direction, directionIcon, dischargingAppIcon, discharging_app, discountAppIcon, discount_app, discoveryAppIcon, discovery_app, dollarBillForwardIcon, dollarBillPartialIcon, download, downloadCustomIcon, dragIndicatorIcon, drag_indicator, driversAssistanceIcon, drivers_assistance, dropFilledAppIcon, drop_filled_app, dwaBrandIcon, eco, ecoIcon, edit, editIcon, editSmallRightAlignedAppIcon, edit_small_right_aligned_app, efficiency, efficiencyIcon, electricCarsIcon, electricCarsServiceIcon, electric_cars, electric_cars_service, electricity, electricityFilledAppIcon, electricityIcon, electricity_filled_app, emergency, emergencyIcon, emission, emissionIcon, energyIcon, engine, engineIcon, entertainment, entertainmentIcon, escapeHtml, escapeRegex, exportAppIcon, export_app, expressServiceIcon, express_service, exterior, exterior360Icon, exteriorIcon, exterior_360, externalPartForwardIcon, faq, faqIcon, fastForwardIcon, fast_forward, fax, faxIcon, filter, filterIcon, findACarIcon, findADealerIcon, find_a_car, find_a_dealer, firstRegistrationDateIcon, fleetServiceCommercialIcon, fleetServicePrivateIcon, fleet_service_commercial, fleet_service_private, folderFilledAppIcon, folder_filled_app, foodFilledAppIcon, food_filled_app, formatNumber, fullscreenEnterIcon, fullscreenExitIcon, fullscreen_enter, fullscreen_exit, gallery, galleryIcon, garageAppIcon, garage_app, gasAppIcon, gasCarsServiceIcon, gasIcon, gas_app, glassDamageAppIcon, glass_damage_app, gte, gteIcon, heart, heartFilledAppIcon, heartIcon, heart_filled_app, heightAppIcon, height_app, highwayRoadIcon, highway_road, history, historyIcon, homeAppIcon, homeEnergyAppIcon, homeFilledAppIcon, home_app, home_energy_app, home_filled_app, hornAppIcon, hornFilledAppIcon, horn_app, horn_filled_app, hybrid, hybridIcon, immediateChargingAppIcon, immediate_charging_app, info, infoFilledIcon, infoIcon, info_filled, inputHideIcon, inputShowIcon, input_hide, input_show, interior, interior360Icon, interiorIcon, interior_360, internalPartForwardIcon, internet, internetIcon, invitationAppIcon, invitation_app, invoiceIcon, invoiceReadyIcon, invoiceRecipientIcon, itemsForwardIcon, itemsRecieveIcon, jobportal, jobportalIcon, keyAppIcon, keyCardAppIcon, keyDigitalAppIcon, key_app, key_card_app, key_digital_app, keyboardAppIcon, keyboard_app, layerCollapseAppIcon, layerExpandAppIcon, layer_collapse_app, layer_expand_app, layersAppIcon, layers_app, legalTermsAndConditionsAppIcon, legal_terms_and_conditions_app, licencePlateAppIcon, licence_plate_app, lightAssistappIcon, light_assistapp, lightingAppIcon, lighting_app, linkExternAppIcon, link_extern_app, list, listIcon, loadingVolumeIcon, loading_volume, localBusinessIcon, local_business, locate, locateIcon, lock, lockIcon, lockOpenIcon, lock_open, login, loginIcon, logistic, logisticIcon, logoCommissionModuleFavIcon, logoCommissionModuleIcon, logoCommissionModuleNegativeFavIcon, logoCommissionModuleNegativeIcon, logoCostApprovalFavIcon, logoCostApprovalIcon, logoCostApprovalNegativeFavIcon, logoCostApprovalNegativeIcon, logoCrossControllingFavIcon, logoCrossControllingIcon, logoCrossControllingNegativeFavIcon, logoCrossControllingNegativeIcon, logoDigitalServiceReceptionFavIcon, logoDigitalServiceReceptionIcon, logoDigitalServiceReceptionNegativeFavIcon, logoDigitalServiceReceptionNegativeIcon, logoDocFlowFavIcon, logoDocFlowIcon, logoDocFlowNegativeFavIcon, logoDocFlowNegativeIcon, logoDocScanFavIcon, logoDocScanIcon, logoDocScanNegativeFavIcon, logoDocScanNegativeIcon, logoDocStoreFavIcon, logoDocStoreIcon, logoDocStoreNegativeFavIcon, logoDocStoreNegativeIcon, logoEBillingFavIcon, logoEBillingIcon, logoEBillingNegativeFavIcon, logoEBillingNegativeIcon, logoEPaymentFavIcon, logoEPaymentIcon, logoEPaymentNegativeFavIcon, logoEPaymentNegativeIcon, logoMobilityPlannerFavIcon, logoMobilityPlannerIcon, logoMobilityPlannerNegativeFavIcon, logoMobilityPlannerNegativeIcon, logoPartsMobileFavIcon, logoPartsMobileIcon, logoPartsMobileNegativeFavIcon, logoPartsMobileNegativeIcon, logoSBOFavIcon, logoSBOIcon, logoSBONegativeFavIcon, logoSBONegativeIcon, logoServiceCubeFavIcon, logoServiceCubeIcon, logoServiceCubeNegativeFavIcon, logoServiceCubeNegativeIcon, logoWCPFavIcon, logoWCPIcon, logoWCPNegativeFavIcon, logoWCPNegativeIcon, logoWorkshopOrderTrackerFavIcon, logoWorkshopOrderTrackerIcon, logoWorkshopOrderTrackerNegativeFavIcon, logoWorkshopOrderTrackerNegativeIcon, logout, logoutIcon, magnifier, magnifierIcon, magnifierMinusIcon, magnifierPlusIcon, magnifier_minus, magnifier_plus, mail, mailIcon, mailResendAppIcon, mail_resend_app, manual, manualIcon, map, mapIcon, mapToInternalTree, mechanicIcon, media, mediaIcon, menu, menuAppAppIcon, menuIcon, menu_app_app, microphoneAppIcon, microphone_app, mobile, mobileIcon, moreAppIcon, moreAppbarAppIcon, more_app, more_appbar_app, mot, motIcon, motability, motabilityIcon, navigate, navigateFilledAppIcon, navigateIcon, navigate_filled_app, newCarCommercialIcon, newCarPrivateFilledAppIcon, newCarPrivateIcon, newCarUtilityVehicleIcon, new_car_commercial, new_car_private, new_car_private_filled_app, nightServiceIcon, night_service, notification, notificationFilledIcon, notificationIcon, notification_filled, number0Icon, number10Icon, number11Icon, number12Icon, number13Icon, number14Icon, number15Icon, number16Icon, number17Icon, number18Icon, number19Icon, number1Icon, number20Icon, number2Icon, number3Icon, number4Icon, number5Icon, number6Icon, number7Icon, number8Icon, number9Icon, offers, offersFilledAppIcon, offersIcon, offers_filled_app, officeAppIcon, officeFilledAppIcon, office_app, office_filled_app, oilLevelIcon, oilLevelWarningIcon, oilTemperatureAppIcon, oil_level, oil_level_warning, oil_temperature_app, onCallDutyIcon, on_call_duty, openSatIcon, open_sat, orderIcon, orderStatusIcon, paintMaterialForwardIcon, paintMaterialIcon, paintShopIcon, paint_shop, paragraphAppIcon, paragraph_app, parkHeaterAppIcon, park_heater_app, parking, parkingFilledAppIcon, parkingGarageAppIcon, parkingIcon, parkingLocationIcon, parkingRouteAppIcon, parkingValetAppIcon, parking_filled_app, parking_garage_app, parking_route_app, parking_valet_app, partAvailabilityInfoIcon, partAvailabilityNoIcon, partAvailabilityUnknownIcon, partAvailabilityWarningIcon, partAvailabilityYesIcon, partIdenticalIcon, partIdenticalPredecessorIcon, partIdenticalSuccessorIcon, partIdenticalSuccpredecessorIcon, partPredecessorIcon, partSuccessorIcon, partSuccessorPredecessorIcon, partsChangelocationIcon, partsForwardIcon, partsIcon, partsInventoryIcon, partsNonStockForwardIcon, partsNonStockIcon, partsPickingIcon, partsPickingPlusIcon, partsReceivingIcon, pause, pauseIcon, payload, payloadIcon, paymentAppIcon, paymentCashAppIcon, paymentChargingCardAppIcon, paymentCreditcardAppIcon, paymentMachineAppIcon, payment_app, payment_cash_app, payment_charging_card_app, payment_creditcard_app, payment_machine_app, performance, performanceIcon, petrol, petrolIcon, phone, phoneIcon, pin, pinFilledAppIcon, pinGenericFilledAppIcon, pinIcon, pin_filled_app, pin_generic_filled_app, play, playIcon, plugCcsAppIcon, plugChademoAppIcon, plugChargeAppIcon, plugGenericAppIcon, plugSchukoAppIcon, plugType1AppIcon, plugType2AppIcon, plug_ccs_app, plug_chademo_app, plug_charge_app, plug_generic_app, plug_schuko_app, plug_type1_app, plug_type2_app, plusServiceIcon, porscheBrandIcon, power, powerIcon, powerTrainIcon, powertrain, preHeaterAppIcon, pre_heater_app, preciseLaneNavigationAppIcon, precise_lane_navigation_app, presentAppIcon, present_app, priceTypeSwitchIcon, printer, printerIcon, privacyAppIcon, privacy_app, profile, profileIcon, profileRegisterAppIcon, profileVerifiedIcon, profile_register_app, profile_verified, publicServiceIcon, publicTransportAppIcon, public_service, public_transport_app, qualifiedWorkshopIcon, qualified_workshop, questionnaireAppIcon, questionnaire_app, radio, radioButtonInselectedIcon, radioButtonSelectedForDefIcon, radioButtonSelectedIcon, radioIcon, radio_button_inselected, radio_button_selected, radio_button_selected_for_development, range, rangeIcon, reload, reloadIcon, remove, removeIcon, repeat, repeatIcon, repeatRepairIcon, replacementVehicleIcon, returnDateIcon, rewind, rewindIcon, roadsideAssistanceIcon, roadside_assistance, route, routeArrowAppIcon, routeIcon, route_arrow_app, routesHistoryAppIcon, routes_history_app, rss, rssIcon, safety, safetyIcon, save, saveAppIcon, saveIcon, save_app, seat, seatAirIcon, seatBrandIcon, seatIcon, seat_air, secretTipAppIcon, secretTipFilledAppIcon, secret_tip_app, secret_tip_filled_app, selected, selectedIcon, selectedPartnerNetworkAppIcon, selected_partner_network_app, sendToCarAppIcon, send_to_car_app, service, serviceAdvisorIcon, serviceBellIcon, serviceFilledAppIcon, serviceIcon, service_bell, service_filled_app, settings, settingsIcon, shareAndroidIcon, shareIosIcon, share_android, share_ios, shoppingCartFilledAppIcon, shoppingCartIcon, shopping_cart, shopping_cart_filled_app, shuffle, shuffleIcon, size, sizeIcon, skillAppIcon, skill_app, skipBackwardIcon, skipForwardIcon, skip_backward, skip_forward, skodaBrandIcon, softwareDownloadAppIcon, software_download_app, sortingAppIcon, sorting_app, sound, soundIcon, standardEquipmentIcon, standard_equipment, starFilledIcon, starOutlineIcon, star_filled, star_outline, statisticAppIcon, statistic_app, stockLocatorCommercialIcon, stockLocatorPrivateIcon, stock_locator_commercial, stock_locator_private, stop, stopIcon, strip, switchPositionAppIcon, switch_position_app, syncAppIcon, sync_app, taskAndAppointmentIcon, taxiDealerIcon, taxi_dealer, technicalSpecificationIcon, technical_specification, temperatureAppIcon, temperature_app, testDriveIcon, test_drive, textForwardIcon, thumbsdownAppIcon, thumbsdownFilledAppIcon, thumbsdown_app, thumbsdown_filled_app, thumbsupAppIcon, thumbsupFilledAppIcon, thumbsup_app, thumbsup_filled_app, timeClimatisationAppIcon, timePreferredAppIcon, time_climatisation_app, time_preferred_app, timer, timerIcon, topcardIcon, touaregServiceIcon, transcriptDownloadIcon, transcript_download, transmissionAutomaticIcon, transmissionManualIcon, transmission_automatic, transmission_manual, tripAppIcon, tripLongAppIcon, tripPartedAppIcon, tripShortAppIcon, trip_app, trip_long_app, trip_parted_app, trip_short_app, turnSignalsIcon, turn_signals, unselected, unselectedIcon, updateRefreshAppIcon, update_refresh_app, upload, uploadAppIcon, uploadCustomIcon, upload_app, usedCarCommercialIcon, usedCarPrivateIcon, used_car_commercial, used_car_private, vehicleAmarokIcon, vehicleCaddyIcon, vehicleConversionIcon, vehicleCrafterIcon, vehicleHightIcon, vehicleIdBuzzIcon, vehicleMultivanIcon, vehicleTransporterIcon, vehicle_amarok, vehicle_caddy, vehicle_crafter, vehicle_hight, vehicle_idbuzz, vehicle_multivan, vehicle_transporter, videoChatIcon, video_chat, view360Icon, view_360, vinIcon, virtualRealityIcon, virtual_reality, voiceMessageAppIcon, voice_message_app, volkswagenAppIcon, volkswagenIcon, volkswagen_app, volumeMaximumIcon, volumeMediumIcon, volumeMuteIcon, volume_maximum, volume_medium, volume_mute, vsfSearch48Icon, vsfSearchIcon, vwBrandIcon, vwConnectLicenseAppIcon, vw_connect_license_app, vwnBrandIcon, walkingAppIcon, walkingFilledAppIcon, walking_app, walking_filled_app, wallbox, wallboxIcon, wcAppIcon, wc_app, wcpIcon, weAssistAppIcon, weChargeAppIcon, weDeliverAppIcon, weExperienceAppIcon, weParkAppIcon, weUpgradeAppIcon, we_assist_app, we_charge_app, we_deliver_app, we_experience_app, we_park_app, we_upgrade_app, weatherSunAppIcon, weather_sun_app, wheelToWheelIcon, wheel_to_wheel, windscreenWashIcon, windscreen_wash, wlanHotspotIcon, wlan_hotspot, wrenchForwardIcon };
 //# sourceMappingURL=clr-addons.mjs.map