@valtimo/components 13.38.0 → 13.39.0

package/fesm2022/valtimo-components.mjs

@@ -24,7 +24,7 @@ import moment from 'moment';
 import User20 from '@carbon/icons/es/user/20';
 import * as i2$2 from 'keycloak-angular';
 import * as i2$3 from 'carbon-components-angular';
-import { UIShellModule, IconModule, LinkModule, GridModule, TabsModule, StructuredListModule, ToggleModule, TagModule, DropdownModule, LayerModule, SkeletonModule, LoadingModule, Table, TableHeaderItem, TableItem, TableModel, PaginationModule, TableModule as TableModule$1, ContentSwitcherModule, ButtonModule, DialogModule, ModalModule as ModalModule$1, BreadcrumbModule, InputModule as InputModule$1, ComboBoxModule, CheckboxModule, AccordionModule, DatePickerModule as DatePickerModule$1, TimePickerModule, ModalButtonType, TilesModule, RadioModule as RadioModule$1, ModalService as ModalService$1, TooltipModule as TooltipModule$1, NotificationModule, ContextMenuModule, ToggletipModule } from 'carbon-components-angular';
+import { UIShellModule, IconModule, LinkModule, GridModule, TabsModule, StructuredListModule, ToggleModule, TagModule, DropdownModule, LayerModule, SkeletonModule, LoadingModule, Table, TableHeaderItem, TableModel, TableItem, PaginationModule, TableModule as TableModule$1, ContentSwitcherModule, ButtonModule, DialogModule, ModalModule as ModalModule$1, BreadcrumbModule, InputModule as InputModule$1, ComboBoxModule, CheckboxModule, AccordionModule, DatePickerModule as DatePickerModule$1, TimePickerModule, ModalButtonType, TilesModule, RadioModule as RadioModule$1, ModalService as ModalService$1, TooltipModule as TooltipModule$1, NotificationModule, ContextMenuModule, ToggletipModule } from 'carbon-components-angular';
 import * as i6 from '@angular/platform-browser';
 import * as i2$1 from 'ngx-skeleton-loader';
 import { NgxSkeletonLoaderModule } from 'ngx-skeleton-loader';
@@ -6325,7 +6325,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.25", ngImpo
             }] } });
 
 /*
- * Copyright 2015-2025 Ritense BV, the Netherlands.
+ * Copyright 2015-2026 Ritense BV, the Netherlands.
  *
  * Licensed under EUPL, Version 1.2 (the "License");
  * you may not use this file except in compliance with the License.
@@ -6345,6 +6345,54 @@ class ValtimoCdsModalDirective {
         this.elementRef = elementRef;
         this.renderer = renderer;
         this.minContentHeight = 0;
+        /**
+         * Closes the modal on ESC via the same path as the close (X) button.
+         *
+         * Carbon's built-in ESC handler mutates the modal's `open` field directly (bypassing the `[open]`
+         * binding) and calls `modalService.destroy()`, which can desync state or destroy an unrelated
+         * imperatively-created modal. Instead we preempt it and simulate a click on the close button,
+         * which fires the modal's own `(closeSelect)` handler.
+         */
+        this._onDocumentKeydown = (event) => {
+            if (event.key !== 'Escape') {
+                return;
+            }
+            const visibleModals = this.document.querySelectorAll('.cds--modal.is-visible');
+            if (visibleModals.length === 0) {
+                return;
+            }
+            // Only the directive owning the top-most (last rendered) visible modal reacts. Matching the modal
+            // that directly owns the overlay (not merely an ancestor) ensures the correct handler acts when
+            // modals are nested/stacked, so ESC closes only the top modal.
+            const topModal = visibleModals[visibleModals.length - 1];
+            if (topModal.closest('cds-modal') !== this.elementRef.nativeElement) {
+                return;
+            }
+            // If a Carbon dropdown/combo-box menu is open, this ESC belongs to that menu, not the modal, so
+            // we do not close the modal — Carbon's own keydown handler closes the menu (updating its state
+            // and the DOM correctly, because it runs on the real event in Angular's zone). Detection spans
+            // the whole document: with `appendInline=false` the expanded list-box is detached to the body,
+            // and Carbon moves focus into it, so neither the marker nor the event target is inside the
+            // modal. A second ESC (menu closed, marker gone) falls through and closes the modal.
+            //
+            // We also shield the modal: `cds-combo-box` closes on ESC but, unlike `cds-dropdown`, does not
+            // stop propagation, so with focus still in its host the ESC would bubble up to the modal's ESC
+            // handler and close it too. When the focused element is inside a list-box host, a one-time
+            // keydown listener added here fires during the bubble phase after Carbon's own handler (which
+            // was registered earlier) and stops propagation before the event reaches the modal. (When focus
+            // is inside a detached menu the event never reaches the modal, so no shield is needed.)
+            if (this.document.querySelector('.cds--list-box--expanded')) {
+                const listBox = event.target?.closest?.('cds-combo-box, cds-dropdown, cds-multi-select');
+                listBox?.addEventListener('keydown', (e) => e.stopPropagation(), { once: true });
+                return;
+            }
+            event.stopImmediatePropagation();
+            event.preventDefault();
+            // Click this modal's own close (X) button — skipping close buttons of nested modals — so ESC
+            // runs exactly the same handling as the close button. Does nothing if there is no close button.
+            const closeButton = Array.from(this.elementRef.nativeElement.querySelectorAll('.cds--modal-close')).find(button => button.closest('cds-modal') === this.elementRef.nativeElement);
+            closeButton?.click();
+        };
     }
     ngAfterViewInit() {
         this._mutationObserver = new MutationObserver((mutations) => {
@@ -6362,10 +6410,14 @@ class ValtimoCdsModalDirective {
         }
         this.applyStyleToModalElements();
         setTimeout(() => this.applyStyleToModalElements(), 0);
+        // Capture phase so this runs before Carbon's bubbling keydown HostListener, allowing us to
+        // preempt it. Listening on the document (not the host) makes ESC work regardless of focus.
+        this.document.addEventListener('keydown', this._onDocumentKeydown, true);
     }
     ngOnDestroy() {
         this._mutationObserver?.disconnect();
         this.removeDocumentOverflowHidden();
+        this.document.removeEventListener('keydown', this._onDocumentKeydown, true);
     }
     handleMutations(mutations) {
         const OPEN_ATTRIBUTE_NAME = 'ng-reflect-open';
@@ -6694,59 +6746,15 @@ class CarbonListComponent {
             this._fields$,
             this._items$,
             this._viewInitialized$,
-        ]).pipe(filter(([fields, items, viewInitialized]) => !!fields && !!items && viewInitialized), map(([fields, items]) => items.map((item, index) => {
-            const row = [
-                ...this.getDragAndDropItemsItems(item, index, items.length),
-                ...fields.map((field) => {
-                    switch (field.viewType) {
-                        case ViewType.TEMPLATE:
-                            return new TableItem({
-                                data: { item, index, length: items.length, ...field.templateData },
-                                item,
-                                template: field.template,
-                            });
-                        case ViewType.BOOLEAN:
-                            let data = this.resolveObject(field, item);
-                            data = !BOOLEAN_CONVERTER_VALUES.includes(data)
-                                ? data
-                                : `${'viewTypeConverter.' + data}`;
-                            return new TableItem({
-                                data,
-                                template: this.booleanTemplate,
-                                item,
-                            });
-                        case ViewType.TAGS: {
-                            return new TableItem({
-                                data: {
-                                    tags: this.resolveTagObject(item, field.key),
-                                    tagAmount: field?.tagAmount || 1,
-                                },
-                                item,
-                                template: this.tagTemplate,
-                            });
-                        }
-                        default:
-                            const resolvedObject = this.resolveObject(field, item);
-                            return new TableItem({
-                                title: resolvedObject ?? '-',
-                                data: (field.tooltipCharLimit
-                                    ? this.ellipsisPipe.transform(resolvedObject, field.tooltipCharLimit)
-                                    : resolvedObject) ?? '-',
-                                template: this.defaultTemplate,
-                                item,
-                            });
-                    }
-                }),
-                ...this.getExtraItems(item, index, items.length),
-            ];
-            if (this.expandedRowTemplate && row.length > 0) {
-                row[0].expandedData = item;
-                row[0].expandedTemplate = this.expandedRowTemplate;
-            }
-            return row;
-        })), tap$1((data) => {
+        ]).pipe(filter(([fields, items, viewInitialized]) => !!fields && !!items && viewInitialized), map(([fields, items]) => this.buildRowsPreservingIdentity(fields, items)), tap$1((data) => {
             this._completeDataSource = data;
         }));
+        /**
+         * Cached rows from the previous `items` emission, keyed by the item's [trackByKey] (or
+         * [expandedRowKey]) value. Used by [buildRowsPreservingIdentity] to keep row/cell instances —
+         * and therefore their DOM — stable across emissions.
+         */
+        this._reusableRowsByKey = new Map();
         this._filteredItems$ = new BehaviorSubject(null);
         this.model$ = combineLatest([
             this._headerItems$,
@@ -6855,6 +6863,93 @@ class CarbonListComponent {
             pageLength: this.pagination.size,
         };
     }
+    buildRowsPreservingIdentity(fields, items) {
+        const identityKey = this.trackByKey || this.expandedRowKey;
+        if (!identityKey) {
+            return items.map((item, index) => this.buildRow(fields, item, index, items.length));
+        }
+        const previousRows = this._reusableRowsByKey;
+        const nextRows = new Map();
+        const rows = items.map((item, index) => {
+            const freshRow = this.buildRow(fields, item, index, items.length);
+            const key = get(item, identityKey);
+            // Duplicate or absent keys fall back to the fresh row (no identity to preserve).
+            const previousRow = key != null && !nextRows.has(key) ? previousRows.get(key) : undefined;
+            if (!previousRow || previousRow.length !== freshRow.length) {
+                if (key != null && !nextRows.has(key))
+                    nextRows.set(key, freshRow);
+                return freshRow;
+            }
+            // Same row identity: update the existing TableItem instances in place. Carbon's internal
+            // ngFor tracks rows/cells by object identity, so reusing the instances keeps the DOM (incl.
+            // the expanded row) while all bindings re-render with the fresh values.
+            previousRow.forEach((cell, cellIndex) => {
+                const freshCell = freshRow[cellIndex];
+                cell.data = freshCell.data;
+                cell.title = freshCell.title;
+                cell.template = freshCell.template;
+                // `item` is not declared on TableItem; it is smuggled in via the constructor object above.
+                cell.item = freshCell.item;
+                cell.expandedData = freshCell.expandedData;
+                cell.expandedTemplate = freshCell.expandedTemplate;
+            });
+            nextRows.set(key, previousRow);
+            return previousRow;
+        });
+        this._reusableRowsByKey = nextRows;
+        return rows;
+    }
+    buildRow(fields, item, index, length) {
+        const row = [
+            ...this.getDragAndDropItemsItems(item, index, length),
+            ...fields.map((field) => {
+                switch (field.viewType) {
+                    case ViewType.TEMPLATE:
+                        return new TableItem({
+                            data: { item, index, length, ...field.templateData },
+                            item,
+                            template: field.template,
+                        });
+                    case ViewType.BOOLEAN:
+                        let data = this.resolveObject(field, item);
+                        data = !BOOLEAN_CONVERTER_VALUES.includes(data)
+                            ? data
+                            : `${'viewTypeConverter.' + data}`;
+                        return new TableItem({
+                            data,
+                            template: this.booleanTemplate,
+                            item,
+                        });
+                    case ViewType.TAGS: {
+                        return new TableItem({
+                            data: {
+                                tags: this.resolveTagObject(item, field.key),
+                                tagAmount: field?.tagAmount || 1,
+                            },
+                            item,
+                            template: this.tagTemplate,
+                        });
+                    }
+                    default:
+                        const resolvedObject = this.resolveObject(field, item);
+                        return new TableItem({
+                            title: resolvedObject ?? '-',
+                            data: (field.tooltipCharLimit
+                                ? this.ellipsisPipe.transform(resolvedObject, field.tooltipCharLimit)
+                                : resolvedObject) ?? '-',
+                            template: this.defaultTemplate,
+                            item,
+                        });
+                }
+            }),
+            ...this.getExtraItems(item, index, length),
+        ];
+        if (this.expandedRowTemplate && row.length > 0) {
+            row[0].expandedData = item;
+            row[0].expandedTemplate = this.expandedRowTemplate;
+        }
+        return row;
+    }
     get dragAndDropHeaderColumns() {
         const emptyHeader = new TableHeaderItem();
         emptyHeader.sortable = false;
@@ -7266,7 +7361,7 @@ class CarbonListComponent {
         }
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.25", ngImport: i0, type: CarbonListComponent, deps: [{ token: EllipsisPipe }, { token: CarbonListFilterPipe }, { token: i2$3.IconService }, { token: i4.NGXLogger }, { token: i1.TranslateService }, { token: ViewContentService }, { token: KeyStateService }, { token: CarbonListDragAndDropService }, { token: i0.ElementRef }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.25", type: CarbonListComponent, isStandalone: false, selector: "valtimo-carbon-list", inputs: { items: "items", fields: "fields", tableTranslations: "tableTranslations", paginatorConfig: "paginatorConfig", pagination: "pagination", loading: "loading", skeletonRowCount: "skeletonRowCount", actions: "actions", actionItems: "actionItems", showActionItems: "showActionItems", header: "header", hideColumnHeader: "hideColumnHeader", initialSortState: "initialSortState", sortState: "sortState", isSearchable: "isSearchable", initialSearchValue: "initialSearchValue", searchDebounceMs: "searchDebounceMs", invalidSearchFields: "invalidSearchFields", searchFields: "searchFields", enableSingleSelection: "enableSingleSelection", lastColumnTemplate: "lastColumnTemplate", paginationIdentifier: "paginationIdentifier", showSelectionColumn: "showSelectionColumn", striped: "striped", hideToolbar: "hideToolbar", lockedTooltipTranslationKey: "lockedTooltipTranslationKey", movingRowsEnabled: "movingRowsEnabled", dragAndDrop: "dragAndDrop", dragAndDropDisabled: "dragAndDropDisabled", expandedRowTemplate: "expandedRowTemplate", expandedRowKey: "expandedRowKey" }, outputs: { rowClicked: "rowClicked", paginationClicked: "paginationClicked", paginationSet: "paginationSet", search: "search", sortChanged: "sortChanged", moveRow: "moveRow", itemsReordered: "itemsReordered" }, providers: [CarbonListFilterPipe, CarbonListDragAndDropService], viewQueries: [{ propertyName: "actionsMenuTemplate", first: true, predicate: ["actionsMenuTemplate"], descendants: true }, { propertyName: "actionTemplate", first: true, predicate: ["actionTemplate"], descendants: true }, { propertyName: "booleanTemplate", first: true, predicate: ["booleanTemplate"], descendants: true }, { propertyName: "moveRowsTemplate", first: true, predicate: ["moveRowsTemplate"], descendants: true }, { propertyName: "dragAndDropTemplate", first: true, predicate: ["dragAndDropTemplate"], descendants: true }, { propertyName: "rowDisabled", first: true, predicate: ["rowDisabled"], descendants: true }, { propertyName: "tagTemplate", first: true, predicate: ["tagTemplate"], descendants: true }, { propertyName: "defaultTemplate", first: true, predicate: ["defaultTemplate"], descendants: true }, { propertyName: "_table", first: true, predicate: Table, descendants: true }], ngImport: i0, template: "<!--\n  ~ /*\n  ~  * Copyright 2015-2026 Ritense BV, the Netherlands.\n  ~  *\n  ~  * Licensed under EUPL, Version 1.2 (the \"License\");\n  ~  * you may not use this file except in compliance with the License.\n  ~  * You may obtain a copy of the License at\n  ~  *\n  ~  * https://joinup.ec.europa.eu/collection/eupl/eupl-text-eupl-12\n  ~  *\n  ~  * Unless required by applicable law or agreed to in writing, software\n  ~  * distributed under the License is distributed on an \"AS IS\" basis,\n  ~  * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n  ~  * See the License for the specific language governing permissions and\n  ~  * limitations under the License.\n  ~  */\n  -->\n<cds-table-container\n  *ngIf=\"{\n    sort: sort$ | async,\n    model: model$ | async,\n    viewInitialized: viewInitialized$ | async,\n  } as obs\"\n  class=\"valtimo-carbon-list\"\n>\n  <cds-table-header *ngIf=\"header\">\n    <ng-content select=\"[header]\"></ng-content>\n  </cds-table-header>\n\n  <ng-content select=\"[tabs]\"></ng-content>\n\n  <cds-table-toolbar\n    *ngIf=\"!hideToolbar\"\n    class=\"valtimo-carbon-list__toolbar\"\n    [model]=\"obs.model\"\n    [batchText]=\"batchText$ | async\"\n  >\n    <cds-table-toolbar-actions>\n      <ng-content select=\"[carbonToolbarActions]\"> </ng-content>\n    </cds-table-toolbar-actions>\n\n    <cds-table-toolbar-content>\n      <div *ngIf=\"isSearchable\" class=\"valtimo-search-container\" (focusout)=\"onSearchFocusOut($event)\">\n        <cds-table-toolbar-search\n          #toolbarSearch\n          [expandable]=\"false\"\n          [formControl]=\"searchFormControl\"\n          [ngClass]=\"{'valtimo-search--invalid': invalidSearchFields.length > 0}\"\n          data-test-id=\"carbonListSearch\"\n          (input)=\"updateAutocomplete()\"\n          (keydown)=\"onSearchKeydown($event)\"\n          (clear)=\"onSearchClear()\"\n          (open)=\"onSearchOpenChange($event)\"\n        ></cds-table-toolbar-search>\n        <div\n          class=\"valtimo-search-overlay\"\n          aria-hidden=\"true\"\n        ><span\n            *ngFor=\"let segment of getSearchSegments()\"\n            [class.valtimo-search-overlay__invalid]=\"segment.isInvalid\"\n          >{{ segment.text }}</span></div>\n        <ul *ngIf=\"showAutocomplete && filteredSuggestions.length\" class=\"valtimo-search-autocomplete\" [style.left.px]=\"autocompleteLeft\">\n          <li\n            *ngFor=\"let field of filteredSuggestions; let i = index\"\n            [class.selected]=\"i === selectedSuggestionIndex\"\n            (mousedown)=\"selectSuggestion(field)\"\n          >{{ field.title || field.key }}</li>\n        </ul>\n      </div>\n\n      <ng-content select=\"[carbonToolbarContent]\"> </ng-content>\n    </cds-table-toolbar-content>\n  </cds-table-toolbar>\n\n  <cds-table\n    *ngIf=\"!!obs.sort\"\n    [ngClass]=\"{\n      'valtimo-carbon-list__header--hidden': hideColumnHeader,\n      'valtimo-carbon-list--unclickable': !this.rowClicked.observed,\n    }\"\n    [enableSingleSelect]=\"enableSingleSelect\"\n    [model]=\"loading || !obs.viewInitialized ? skeletonModel : obs.model\"\n    [showSelectionColumn]=\"showSelectionColumn\"\n    [skeleton]=\"loading\"\n    [striped]=\"striped\"\n    (sort)=\"onSort(obs.model.header[$event])\"\n    (rowClick)=\"onRowClick($event)\"\n  >\n    <tbody cdsTableBody>\n      <tr class=\"valtimo-carbon-list__no-results\" data-test-id=\"carbonListNoResults\">\n        <td [attr.colspan]=\"obs.model.header.length + (showSelectionColumn ? 1 : 0)\">\n          <ng-content></ng-content>\n        </td>\n\n        <td [attr.colspan]=\"obs.model.header.length + (showSelectionColumn ? 1 : 0)\">\n          {{ 'list.noResults' | translate }}\n        </td>\n      </tr>\n    </tbody>\n  </cds-table>\n\n  <cds-pagination\n    *ngIf=\"paginationModel && items?.length\"\n    [itemsPerPageOptions]=\"paginatorConfig.itemsPerPageOptions\"\n    [model]=\"paginationModel\"\n    [showPageInput]=\"paginatorConfig.showPageInput\"\n    [skeleton]=\"loading\"\n    [translations]=\"paginationTranslations$ | async\"\n    (selectPage)=\"onSelectPage($event)\"\n    data-test-id=\"carbonListPagination\"\n  ></cds-pagination>\n</cds-table-container>\n\n<ng-template #actionTemplate let-data=\"data\">\n  <i\n    class=\"clickable\"\n    [ngClass]=\"data.iconClass\"\n    (click)=\"$event.stopPropagation(); data.callback(data.item)\"\n  ></i>\n</ng-template>\n\n<ng-template #booleanTemplate let-data=\"data\">\n  {{ data | translate }}\n</ng-template>\n\n<ng-template #actionsMenuTemplate let-data=\"data\">\n  <v-overflow-menu\n    *ngIf=\"showActionItems\"\n    [open]=\"currentOpenActionId === data.item\"\n    (openChange)=\"handleActionOpenChange(data.item, $event)\"\n    placement=\"bottom-end\"\n    (click)=\"$event.stopPropagation()\"\n  >\n    <v-overflow-menu-trigger overflowTrigger></v-overflow-menu-trigger>\n    @for (action of data.actions; track action.label) {\n      <v-overflow-menu-option\n        [disabled]=\"action | actionItemDisabled: data.item | async\"\n        [type]=\"action.type\"\n        (selected)=\"action.callback(data.item)\"\n      >\n        <i *ngIf=\"!!action.iconClass\" [ngClass]=\"action.iconClass\"></i>\n\n        {{ action.label | translate }}\n      </v-overflow-menu-option>\n    }\n  </v-overflow-menu>\n</ng-template>\n\n<ng-template #rowDisabled let-data=\"data\">\n  <div *ngIf=\"data.locked\" class=\"locked\">\n    <span\n      class=\"float-right badge badge-pill badge-secondary bg-grey\"\n      ngbTooltip=\"{{ lockedTooltipTranslationKey | translate }}\"\n    >\n      <i class=\"icon mdi mdi-lock\"></i>\n    </span>\n  </div>\n</ng-template>\n\n<ng-template #moveRowsTemplate let-data=\"data\">\n  <div class=\"valtimo-carbon-list__move-rows\">\n    <button\n      cdsButton=\"tertiary\"\n      [disabled]=\"data.index === 0\"\n      [iconOnly]=\"true\"\n      size=\"sm\"\n      (click)=\"onMoveUpClick($event, data)\"\n      data-test-id=\"carbonListMoveUp\"\n    >\n      <svg cdsIcon=\"arrow--up\" size=\"16\"></svg>\n    </button>\n\n    <button\n      cdsButton=\"tertiary\"\n      [disabled]=\"data.index === data.length - 1\"\n      [iconOnly]=\"true\"\n      size=\"sm\"\n      (click)=\"onMoveDownClick($event, data)\"\n      data-test-id=\"carbonListMoveDown\"\n    >\n      <svg cdsIcon=\"arrow--down\" size=\"16\"></svg>\n    </button>\n  </div>\n</ng-template>\n\n<ng-template #dragAndDropTemplate let-data=\"data\">\n  <div class=\"valtimo-carbon-list__draggable\">\n    <button\n      cdsButton=\"ghost\"\n      [disabled]=\"dragAndDropDisabled\"\n      [iconOnly]=\"true\"\n      size=\"sm\"\n      (mousedown)=\"onDragStart($event, data)\"\n      data-test-id=\"carbonListDragHandle\"\n    >\n      <svg cdsIcon=\"draggable\" size=\"16\"></svg>\n    </button>\n  </div>\n</ng-template>\n\n<ng-template #tagTemplate let-data=\"data\">\n  @if (!data.tags) {\n    -\n  } @else {\n    <div class=\"tag-template\">\n      @if (data.tags.length === 0) {\n        -\n      } @else {\n        @for (tag of data.tags.slice(0, data.tagAmount); track tag) {\n          <cds-tag class=\"cds-tag--no-margin\" [type]=\"tag.type\">\n            {{ tag.ellipsisContent ?? tag.content }}\n          </cds-tag>\n        }\n\n        <cds-tag\n          *ngIf=\"data.tags.length > data.tagAmount\"\n          class=\"cds-tag--no-margin valtimo-carbon-list__expand-tag\"\n          type=\"high-contrast\"\n          (click)=\"onTagClick($event, data.tags)\"\n          data-test-id=\"carbonListExpandTags\"\n        >\n          {{ data.tags.length - data.tagAmount }} <svg cdsIcon=\"add\" size=\"16\"></svg>\n        </cds-tag>\n      }\n    </div>\n  }\n</ng-template>\n\n<ng-template #defaultTemplate let-data=\"data\">\n  <span>{{ data }}</span>\n</ng-template>\n\n<valtimo-tags-modal\n  [open]=\"tagModalOpen$ | async\"\n  [tags]=\"tagModalData$ | async\"\n  (closeEvent)=\"onCloseEvent()\"\n></valtimo-tags-modal>\n", styles: [".clickable{cursor:pointer}.container-fluid{background-color:var(--cds-layer)}.tile-holder{background-color:#f5f5f5;border:1px solid transparent}.tile-holder:hover{background-color:#eee;border:1px solid #dee2e6}th:first-child,td:first-child{padding-left:25px}::ng-deep tr:has(>td .locked){cursor:not-allowed}::ng-deep tr:has(>td .locked) td{color:var(--cds-text-on-color-disabled)}::ng-deep .valtimo-carbon-list__header--hidden thead{display:none}::ng-deep .valtimo-carbon-list--unclickable tr{cursor:default}.valtimo-carbon-list__toolbar:empty{display:none}.valtimo-carbon-list__no-results{cursor:default}.valtimo-carbon-list__no-results td:empty,.valtimo-carbon-list__no-results td:not(:empty)+td{display:none}.valtimo-carbon-list__move-rows,.valtimo-carbon-list__draggable{width:100%;justify-content:flex-end;display:flex;flex-direction:row;position:relative}.valtimo-carbon-list__move-rows button:not(:last-child),.valtimo-carbon-list__draggable button:not(:last-child){margin-right:8px}.valtimo-carbon-list__expand-tag{cursor:pointer}.valtimo-carbon-list label{margin-bottom:0!important}.valtimo-carbon-list ::ng-deep .tag-template .cds--tag{margin:0}.valtimo-carbon-list ::ng-deep .tag-template .cds--tag svg{fill:var(--cds-background)}.valtimo-carbon-list ::ng-deep .tag-template>*:not(:last-child){margin-right:8px}.valtimo-carbon-list ::ng-deep .cds--tag{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;display:inline-block;line-height:24px}.valtimo-carbon-list ::ng-deep .valtimo-carbon-list__draggable .cds--btn--ghost{cursor:move!important;padding-top:8px!important;padding-bottom:8px!important}::ng-deep .valtimo-carbon-list__drag-table-row{cursor:move!important}::ng-deep .valtimo-carbon-list__drag-table-row .valtimo-carbon-list__draggable .cds--btn--ghost{outline:0;border-color:var(--cds-button-focus-color, var(--cds-focus, var(--vcds-color-60)));box-shadow:inset 0 0 0 1px var(--cds-button-focus-color, var(--cds-focus, var(--vcds-color-60))),inset 0 0 0 2px var(--cds-background, #f4f4f4)}.valtimo-carbon-list ::ng-deep cds-table{display:block;overflow-x:auto;overflow-y:hidden}.valtimo-carbon-list ::ng-deep .cds--expandable-row:not(.cds--parent-row) td{border-top:none;border-bottom-width:2px}.valtimo-carbon-list ::ng-deep tbody .cds--expandable-row.cds--parent-row td{border-bottom-width:2px}.valtimo-carbon-list ::ng-deep tbody tr:first-child td{border-top:none!important}.valtimo-search-container{position:relative;flex:1}.valtimo-search-container ::ng-deep cds-table-toolbar-search{display:flex;justify-content:flex-end;width:100%}.valtimo-search-container ::ng-deep cds-table-toolbar-search .cds--toolbar-search-container-active{width:100%}.valtimo-search-container ::ng-deep .cds--toolbar-search-container-active input{color:transparent!important;caret-color:var(--cds-text-primary, #161616)}.valtimo-search-overlay{position:absolute;inset:0;display:flex;align-items:center;height:3rem;padding:0 3rem;font-family:IBM Plex Sans,Helvetica Neue,Arial,sans-serif;font-size:.875rem;font-weight:400;letter-spacing:.16px;line-height:1.28572;color:var(--cds-text-primary, #161616);white-space:pre;pointer-events:none;overflow:hidden}.valtimo-search-overlay__invalid{text-decoration:underline wavy var(--cds-support-error, #da1e28);text-decoration-skip-ink:none;text-underline-offset:3px}.valtimo-search-autocomplete{position:absolute;top:100%;max-height:150px;min-width:120px;max-width:250px;width:auto;overflow-y:auto;background:var(--cds-layer);border:1px solid var(--cds-border-subtle);box-shadow:0 2px 6px #0000001a;z-index:9000;list-style:none;margin:0;padding:0}.valtimo-search-autocomplete li{padding:6px 12px;cursor:pointer;font-size:.875rem;white-space:nowrap}.valtimo-search-autocomplete li:hover,.valtimo-search-autocomplete li.selected{background:var(--cds-layer-hover)}\n/*!\n * Copyright 2015-2026 Ritense BV, the Netherlands.\n *\n * Licensed under EUPL, Version 1.2 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n * https://joinup.ec.europa.eu/collection/eupl/eupl-text-eupl-12\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" basis,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n"], dependencies: [{ kind: "directive", type: i1$4.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1$4.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1$4.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "component", type: i2$3.Pagination, selector: "cds-pagination, ibm-pagination", inputs: ["skeleton", "model", "disabled", "pageInputDisabled", "showPageInput", "pagesUnknown", "pageSelectThreshold", "translations", "itemsPerPageOptions"], outputs: ["selectPage"] }, { kind: "component", type: i2$3.TableToolbar, selector: "cds-table-toolbar, ibm-table-toolbar", inputs: ["model", "batchText", "ariaLabel", "cancelText", "size"], outputs: ["cancel"] }, { kind: "component", type: i2$3.TableContainer, selector: "cds-table-container, ibm-table-container" }, { kind: "component", type: i2$3.TableHeader, selector: "cds-table-header, ibm-table-header" }, { kind: "component", type: i2$3.TableToolbarActions, selector: "cds-table-toolbar-actions, ibm-table-toolbar-actions" }, { kind: "component", type: i2$3.TableToolbarSearch, selector: "cds-table-toolbar-search, ibm-table-toolbar-search" }, { kind: "component", type: i2$3.TableToolbarContent, selector: "cds-table-toolbar-content, ibm-table-toolbar-content" }, { kind: "component", type: i2$3.Table, selector: "cds-table, ibm-table", inputs: ["ariaLabelledby", "ariaDescribedby", "model", "size", "skeleton", "isDataGrid", "sortable", "noBorder", "showExpandAllToggle", "showSelectionColumn", "enableSingleSelect", "scrollLoadDistance", "expandButtonAriaLabel", "sortDescendingLabel", "sortAscendingLabel", "translations", "striped", "stickyHeader", "footerTemplate", "selectionLabelColumn"], outputs: ["sort", "selectAll", "deselectAll", "selectRow", "deselectRow", "rowClick", "scrollLoad"] }, { kind: "component", type: i2$3.TableBody, selector: "[cdsTableBody], [ibmTableBody]", inputs: ["model", "enableSingleSelect", "expandButtonAriaLabel", "checkboxRowLabel", "showSelectionColumn", "size", "selectionLabelColumn", "skeleton"], outputs: ["selectRow", "deselectRow", "rowClick"] }, { kind: "directive", type: i2.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "directive", type: i2$3.IconDirective, selector: "[cdsIcon], [ibmIcon]", inputs: ["ibmIcon", "cdsIcon", "size", "title", "ariaLabel", "ariaLabelledBy", "ariaHidden", "isFocusable"] }, { kind: "directive", type: i2$3.Button, selector: "[cdsButton], [ibmButton]", inputs: ["ibmButton", "cdsButton", "size", "skeleton", "iconOnly", "isExpressive"] }, { kind: "directive", type: i11.NgbTooltip, selector: "[ngbTooltip]", inputs: ["animation", "autoClose", "placement", "triggers", "container", "disableTooltip", "tooltipClass", "openDelay", "closeDelay", "ngbTooltip"], outputs: ["shown", "hidden"], exportAs: ["ngbTooltip"] }, { kind: "component", type: i2$3.Tag, selector: "cds-tag, ibm-tag", inputs: ["type", "size", "class", "skeleton"] }, { kind: "component", type: OverflowMenuComponent, selector: "v-overflow-menu", inputs: ["open", "placement", "menuWidth", "offsetX", "offsetY", "closeOnSelect", "useHostAsReference", "portalToBody"], outputs: ["openChange"] }, { kind: "component", type: OverflowMenuOptionComponent, selector: "v-overflow-menu-option", inputs: ["disabled", "type", "testId", "optionId"], outputs: ["selected"] }, { kind: "component", type: OverflowMenuTriggerComponent, selector: "v-overflow-menu-trigger", inputs: ["compact"] }, { kind: "component", type: CarbonTagsModalComponent, selector: "valtimo-tags-modal", inputs: ["open", "tags"], outputs: ["closeEvent"] }, { kind: "pipe", type: i1$4.AsyncPipe, name: "async" }, { kind: "pipe", type: i1.TranslatePipe, name: "translate" }, { kind: "pipe", type: ActionItemDisabledPipe, name: "actionItemDisabled" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.25", type: CarbonListComponent, isStandalone: false, selector: "valtimo-carbon-list", inputs: { items: "items", fields: "fields", tableTranslations: "tableTranslations", paginatorConfig: "paginatorConfig", pagination: "pagination", loading: "loading", skeletonRowCount: "skeletonRowCount", actions: "actions", actionItems: "actionItems", showActionItems: "showActionItems", header: "header", hideColumnHeader: "hideColumnHeader", initialSortState: "initialSortState", sortState: "sortState", isSearchable: "isSearchable", initialSearchValue: "initialSearchValue", searchDebounceMs: "searchDebounceMs", invalidSearchFields: "invalidSearchFields", searchFields: "searchFields", enableSingleSelection: "enableSingleSelection", lastColumnTemplate: "lastColumnTemplate", paginationIdentifier: "paginationIdentifier", showSelectionColumn: "showSelectionColumn", striped: "striped", hideToolbar: "hideToolbar", lockedTooltipTranslationKey: "lockedTooltipTranslationKey", movingRowsEnabled: "movingRowsEnabled", dragAndDrop: "dragAndDrop", dragAndDropDisabled: "dragAndDropDisabled", expandedRowTemplate: "expandedRowTemplate", expandedRowKey: "expandedRowKey", trackByKey: "trackByKey" }, outputs: { rowClicked: "rowClicked", paginationClicked: "paginationClicked", paginationSet: "paginationSet", search: "search", sortChanged: "sortChanged", moveRow: "moveRow", itemsReordered: "itemsReordered" }, providers: [CarbonListFilterPipe, CarbonListDragAndDropService], viewQueries: [{ propertyName: "actionsMenuTemplate", first: true, predicate: ["actionsMenuTemplate"], descendants: true }, { propertyName: "actionTemplate", first: true, predicate: ["actionTemplate"], descendants: true }, { propertyName: "booleanTemplate", first: true, predicate: ["booleanTemplate"], descendants: true }, { propertyName: "moveRowsTemplate", first: true, predicate: ["moveRowsTemplate"], descendants: true }, { propertyName: "dragAndDropTemplate", first: true, predicate: ["dragAndDropTemplate"], descendants: true }, { propertyName: "rowDisabled", first: true, predicate: ["rowDisabled"], descendants: true }, { propertyName: "tagTemplate", first: true, predicate: ["tagTemplate"], descendants: true }, { propertyName: "defaultTemplate", first: true, predicate: ["defaultTemplate"], descendants: true }, { propertyName: "_table", first: true, predicate: Table, descendants: true }], ngImport: i0, template: "<!--\n  ~ /*\n  ~  * Copyright 2015-2026 Ritense BV, the Netherlands.\n  ~  *\n  ~  * Licensed under EUPL, Version 1.2 (the \"License\");\n  ~  * you may not use this file except in compliance with the License.\n  ~  * You may obtain a copy of the License at\n  ~  *\n  ~  * https://joinup.ec.europa.eu/collection/eupl/eupl-text-eupl-12\n  ~  *\n  ~  * Unless required by applicable law or agreed to in writing, software\n  ~  * distributed under the License is distributed on an \"AS IS\" basis,\n  ~  * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n  ~  * See the License for the specific language governing permissions and\n  ~  * limitations under the License.\n  ~  */\n  -->\n<cds-table-container\n  *ngIf=\"{\n    sort: sort$ | async,\n    model: model$ | async,\n    viewInitialized: viewInitialized$ | async,\n  } as obs\"\n  class=\"valtimo-carbon-list\"\n>\n  <cds-table-header *ngIf=\"header\">\n    <ng-content select=\"[header]\"></ng-content>\n  </cds-table-header>\n\n  <ng-content select=\"[tabs]\"></ng-content>\n\n  <cds-table-toolbar\n    *ngIf=\"!hideToolbar\"\n    class=\"valtimo-carbon-list__toolbar\"\n    [model]=\"obs.model\"\n    [batchText]=\"batchText$ | async\"\n  >\n    <cds-table-toolbar-actions>\n      <ng-content select=\"[carbonToolbarActions]\"> </ng-content>\n    </cds-table-toolbar-actions>\n\n    <cds-table-toolbar-content>\n      <div *ngIf=\"isSearchable\" class=\"valtimo-search-container\" (focusout)=\"onSearchFocusOut($event)\">\n        <cds-table-toolbar-search\n          #toolbarSearch\n          [expandable]=\"false\"\n          [formControl]=\"searchFormControl\"\n          [ngClass]=\"{'valtimo-search--invalid': invalidSearchFields.length > 0}\"\n          data-test-id=\"carbonListSearch\"\n          (input)=\"updateAutocomplete()\"\n          (keydown)=\"onSearchKeydown($event)\"\n          (clear)=\"onSearchClear()\"\n          (open)=\"onSearchOpenChange($event)\"\n        ></cds-table-toolbar-search>\n        <div\n          class=\"valtimo-search-overlay\"\n          aria-hidden=\"true\"\n        ><span\n            *ngFor=\"let segment of getSearchSegments()\"\n            [class.valtimo-search-overlay__invalid]=\"segment.isInvalid\"\n          >{{ segment.text }}</span></div>\n        <ul *ngIf=\"showAutocomplete && filteredSuggestions.length\" class=\"valtimo-search-autocomplete\" [style.left.px]=\"autocompleteLeft\">\n          <li\n            *ngFor=\"let field of filteredSuggestions; let i = index\"\n            [class.selected]=\"i === selectedSuggestionIndex\"\n            (mousedown)=\"selectSuggestion(field)\"\n          >{{ field.title || field.key }}</li>\n        </ul>\n      </div>\n\n      <ng-content select=\"[carbonToolbarContent]\"> </ng-content>\n    </cds-table-toolbar-content>\n  </cds-table-toolbar>\n\n  <cds-table\n    *ngIf=\"!!obs.sort\"\n    [ngClass]=\"{\n      'valtimo-carbon-list__header--hidden': hideColumnHeader,\n      'valtimo-carbon-list--unclickable': !this.rowClicked.observed,\n    }\"\n    [enableSingleSelect]=\"enableSingleSelect\"\n    [model]=\"loading || !obs.viewInitialized ? skeletonModel : obs.model\"\n    [showSelectionColumn]=\"showSelectionColumn\"\n    [skeleton]=\"loading\"\n    [striped]=\"striped\"\n    (sort)=\"onSort(obs.model.header[$event])\"\n    (rowClick)=\"onRowClick($event)\"\n  >\n    <tbody cdsTableBody>\n      <tr class=\"valtimo-carbon-list__no-results\" data-test-id=\"carbonListNoResults\">\n        <td [attr.colspan]=\"obs.model.header.length + (showSelectionColumn ? 1 : 0)\">\n          <ng-content></ng-content>\n        </td>\n\n        <td [attr.colspan]=\"obs.model.header.length + (showSelectionColumn ? 1 : 0)\">\n          {{ 'list.noResults' | translate }}\n        </td>\n      </tr>\n    </tbody>\n  </cds-table>\n\n  <cds-pagination\n    *ngIf=\"paginationModel && items?.length\"\n    [itemsPerPageOptions]=\"paginatorConfig.itemsPerPageOptions\"\n    [model]=\"paginationModel\"\n    [showPageInput]=\"paginatorConfig.showPageInput\"\n    [skeleton]=\"loading\"\n    [translations]=\"paginationTranslations$ | async\"\n    (selectPage)=\"onSelectPage($event)\"\n    data-test-id=\"carbonListPagination\"\n  ></cds-pagination>\n</cds-table-container>\n\n<ng-template #actionTemplate let-data=\"data\">\n  <i\n    class=\"clickable\"\n    [ngClass]=\"data.iconClass\"\n    (click)=\"$event.stopPropagation(); data.callback(data.item)\"\n  ></i>\n</ng-template>\n\n<ng-template #booleanTemplate let-data=\"data\">\n  {{ data | translate }}\n</ng-template>\n\n<ng-template #actionsMenuTemplate let-data=\"data\">\n  <v-overflow-menu\n    *ngIf=\"showActionItems\"\n    [open]=\"currentOpenActionId === data.item\"\n    (openChange)=\"handleActionOpenChange(data.item, $event)\"\n    placement=\"bottom-end\"\n    (click)=\"$event.stopPropagation()\"\n  >\n    <v-overflow-menu-trigger overflowTrigger></v-overflow-menu-trigger>\n    @for (action of data.actions; track action.label) {\n      <v-overflow-menu-option\n        [disabled]=\"action | actionItemDisabled: data.item | async\"\n        [type]=\"action.type\"\n        (selected)=\"action.callback(data.item)\"\n      >\n        <i *ngIf=\"!!action.iconClass\" [ngClass]=\"action.iconClass\"></i>\n\n        {{ action.label | translate }}\n      </v-overflow-menu-option>\n    }\n  </v-overflow-menu>\n</ng-template>\n\n<ng-template #rowDisabled let-data=\"data\">\n  <div *ngIf=\"data.locked\" class=\"locked\">\n    <span\n      class=\"float-right badge badge-pill badge-secondary bg-grey\"\n      ngbTooltip=\"{{ lockedTooltipTranslationKey | translate }}\"\n    >\n      <i class=\"icon mdi mdi-lock\"></i>\n    </span>\n  </div>\n</ng-template>\n\n<ng-template #moveRowsTemplate let-data=\"data\">\n  <div class=\"valtimo-carbon-list__move-rows\">\n    <button\n      cdsButton=\"tertiary\"\n      [disabled]=\"data.index === 0\"\n      [iconOnly]=\"true\"\n      size=\"sm\"\n      (click)=\"onMoveUpClick($event, data)\"\n      data-test-id=\"carbonListMoveUp\"\n    >\n      <svg cdsIcon=\"arrow--up\" size=\"16\"></svg>\n    </button>\n\n    <button\n      cdsButton=\"tertiary\"\n      [disabled]=\"data.index === data.length - 1\"\n      [iconOnly]=\"true\"\n      size=\"sm\"\n      (click)=\"onMoveDownClick($event, data)\"\n      data-test-id=\"carbonListMoveDown\"\n    >\n      <svg cdsIcon=\"arrow--down\" size=\"16\"></svg>\n    </button>\n  </div>\n</ng-template>\n\n<ng-template #dragAndDropTemplate let-data=\"data\">\n  <div class=\"valtimo-carbon-list__draggable\">\n    <button\n      cdsButton=\"ghost\"\n      [disabled]=\"dragAndDropDisabled\"\n      [iconOnly]=\"true\"\n      size=\"sm\"\n      (mousedown)=\"onDragStart($event, data)\"\n      data-test-id=\"carbonListDragHandle\"\n    >\n      <svg cdsIcon=\"draggable\" size=\"16\"></svg>\n    </button>\n  </div>\n</ng-template>\n\n<ng-template #tagTemplate let-data=\"data\">\n  @if (!data.tags) {\n    -\n  } @else {\n    <div class=\"tag-template\">\n      @if (data.tags.length === 0) {\n        -\n      } @else {\n        @for (tag of data.tags.slice(0, data.tagAmount); track tag) {\n          <cds-tag class=\"cds-tag--no-margin\" [type]=\"tag.type\">\n            {{ tag.ellipsisContent ?? tag.content }}\n          </cds-tag>\n        }\n\n        <cds-tag\n          *ngIf=\"data.tags.length > data.tagAmount\"\n          class=\"cds-tag--no-margin valtimo-carbon-list__expand-tag\"\n          type=\"high-contrast\"\n          (click)=\"onTagClick($event, data.tags)\"\n          data-test-id=\"carbonListExpandTags\"\n        >\n          {{ data.tags.length - data.tagAmount }} <svg cdsIcon=\"add\" size=\"16\"></svg>\n        </cds-tag>\n      }\n    </div>\n  }\n</ng-template>\n\n<ng-template #defaultTemplate let-data=\"data\">\n  <span>{{ data }}</span>\n</ng-template>\n\n<valtimo-tags-modal\n  [open]=\"tagModalOpen$ | async\"\n  [tags]=\"tagModalData$ | async\"\n  (closeEvent)=\"onCloseEvent()\"\n></valtimo-tags-modal>\n", styles: [".clickable{cursor:pointer}.container-fluid{background-color:var(--cds-layer)}.tile-holder{background-color:#f5f5f5;border:1px solid transparent}.tile-holder:hover{background-color:#eee;border:1px solid #dee2e6}th:first-child,td:first-child{padding-left:25px}::ng-deep tr:has(>td .locked){cursor:not-allowed}::ng-deep tr:has(>td .locked) td{color:var(--cds-text-on-color-disabled)}::ng-deep .valtimo-carbon-list__header--hidden thead{display:none}::ng-deep .valtimo-carbon-list--unclickable tr{cursor:default}.valtimo-carbon-list__toolbar:empty{display:none}.valtimo-carbon-list__no-results{cursor:default}.valtimo-carbon-list__no-results td:empty,.valtimo-carbon-list__no-results td:not(:empty)+td{display:none}.valtimo-carbon-list__move-rows,.valtimo-carbon-list__draggable{width:100%;justify-content:flex-end;display:flex;flex-direction:row;position:relative}.valtimo-carbon-list__move-rows button:not(:last-child),.valtimo-carbon-list__draggable button:not(:last-child){margin-right:8px}.valtimo-carbon-list__expand-tag{cursor:pointer}.valtimo-carbon-list label{margin-bottom:0!important}.valtimo-carbon-list ::ng-deep .tag-template .cds--tag{margin:0}.valtimo-carbon-list ::ng-deep .tag-template .cds--tag svg{fill:var(--cds-background)}.valtimo-carbon-list ::ng-deep .tag-template>*:not(:last-child){margin-right:8px}.valtimo-carbon-list ::ng-deep .cds--tag{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;display:inline-block;line-height:24px}.valtimo-carbon-list ::ng-deep .valtimo-carbon-list__draggable .cds--btn--ghost{cursor:move!important;padding-top:8px!important;padding-bottom:8px!important}::ng-deep .valtimo-carbon-list__drag-table-row{cursor:move!important}::ng-deep .valtimo-carbon-list__drag-table-row .valtimo-carbon-list__draggable .cds--btn--ghost{outline:0;border-color:var(--cds-button-focus-color, var(--cds-focus, var(--vcds-color-60)));box-shadow:inset 0 0 0 1px var(--cds-button-focus-color, var(--cds-focus, var(--vcds-color-60))),inset 0 0 0 2px var(--cds-background, #f4f4f4)}.valtimo-carbon-list ::ng-deep cds-table{display:block;overflow-x:auto;overflow-y:hidden}.valtimo-carbon-list ::ng-deep .cds--expandable-row:not(.cds--parent-row) td{border-top:none;border-bottom-width:2px}.valtimo-carbon-list ::ng-deep tbody .cds--expandable-row.cds--parent-row td{border-bottom-width:2px}.valtimo-carbon-list ::ng-deep tbody tr:first-child td{border-top:none!important}.valtimo-search-container{position:relative;flex:1}.valtimo-search-container ::ng-deep cds-table-toolbar-search{display:flex;justify-content:flex-end;width:100%}.valtimo-search-container ::ng-deep cds-table-toolbar-search .cds--toolbar-search-container-active{width:100%}.valtimo-search-container ::ng-deep .cds--toolbar-search-container-active input{color:transparent!important;caret-color:var(--cds-text-primary, #161616)}.valtimo-search-overlay{position:absolute;inset:0;display:flex;align-items:center;height:3rem;padding:0 3rem;font-family:IBM Plex Sans,Helvetica Neue,Arial,sans-serif;font-size:.875rem;font-weight:400;letter-spacing:.16px;line-height:1.28572;color:var(--cds-text-primary, #161616);white-space:pre;pointer-events:none;overflow:hidden}.valtimo-search-overlay__invalid{text-decoration:underline wavy var(--cds-support-error, #da1e28);text-decoration-skip-ink:none;text-underline-offset:3px}.valtimo-search-autocomplete{position:absolute;top:100%;max-height:150px;min-width:120px;max-width:250px;width:auto;overflow-y:auto;background:var(--cds-layer);border:1px solid var(--cds-border-subtle);box-shadow:0 2px 6px #0000001a;z-index:9000;list-style:none;margin:0;padding:0}.valtimo-search-autocomplete li{padding:6px 12px;cursor:pointer;font-size:.875rem;white-space:nowrap}.valtimo-search-autocomplete li:hover,.valtimo-search-autocomplete li.selected{background:var(--cds-layer-hover)}\n/*!\n * Copyright 2015-2026 Ritense BV, the Netherlands.\n *\n * Licensed under EUPL, Version 1.2 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n * https://joinup.ec.europa.eu/collection/eupl/eupl-text-eupl-12\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" basis,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n"], dependencies: [{ kind: "directive", type: i1$4.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1$4.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1$4.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "component", type: i2$3.Pagination, selector: "cds-pagination, ibm-pagination", inputs: ["skeleton", "model", "disabled", "pageInputDisabled", "showPageInput", "pagesUnknown", "pageSelectThreshold", "translations", "itemsPerPageOptions"], outputs: ["selectPage"] }, { kind: "component", type: i2$3.TableToolbar, selector: "cds-table-toolbar, ibm-table-toolbar", inputs: ["model", "batchText", "ariaLabel", "cancelText", "size"], outputs: ["cancel"] }, { kind: "component", type: i2$3.TableContainer, selector: "cds-table-container, ibm-table-container" }, { kind: "component", type: i2$3.TableHeader, selector: "cds-table-header, ibm-table-header" }, { kind: "component", type: i2$3.TableToolbarActions, selector: "cds-table-toolbar-actions, ibm-table-toolbar-actions" }, { kind: "component", type: i2$3.TableToolbarSearch, selector: "cds-table-toolbar-search, ibm-table-toolbar-search" }, { kind: "component", type: i2$3.TableToolbarContent, selector: "cds-table-toolbar-content, ibm-table-toolbar-content" }, { kind: "component", type: i2$3.Table, selector: "cds-table, ibm-table", inputs: ["ariaLabelledby", "ariaDescribedby", "model", "size", "skeleton", "isDataGrid", "sortable", "noBorder", "showExpandAllToggle", "showSelectionColumn", "enableSingleSelect", "scrollLoadDistance", "expandButtonAriaLabel", "sortDescendingLabel", "sortAscendingLabel", "translations", "striped", "stickyHeader", "footerTemplate", "selectionLabelColumn"], outputs: ["sort", "selectAll", "deselectAll", "selectRow", "deselectRow", "rowClick", "scrollLoad"] }, { kind: "component", type: i2$3.TableBody, selector: "[cdsTableBody], [ibmTableBody]", inputs: ["model", "enableSingleSelect", "expandButtonAriaLabel", "checkboxRowLabel", "showSelectionColumn", "size", "selectionLabelColumn", "skeleton"], outputs: ["selectRow", "deselectRow", "rowClick"] }, { kind: "directive", type: i2.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "directive", type: i2$3.IconDirective, selector: "[cdsIcon], [ibmIcon]", inputs: ["ibmIcon", "cdsIcon", "size", "title", "ariaLabel", "ariaLabelledBy", "ariaHidden", "isFocusable"] }, { kind: "directive", type: i2$3.Button, selector: "[cdsButton], [ibmButton]", inputs: ["ibmButton", "cdsButton", "size", "skeleton", "iconOnly", "isExpressive"] }, { kind: "directive", type: i11.NgbTooltip, selector: "[ngbTooltip]", inputs: ["animation", "autoClose", "placement", "triggers", "container", "disableTooltip", "tooltipClass", "openDelay", "closeDelay", "ngbTooltip"], outputs: ["shown", "hidden"], exportAs: ["ngbTooltip"] }, { kind: "component", type: i2$3.Tag, selector: "cds-tag, ibm-tag", inputs: ["type", "size", "class", "skeleton"] }, { kind: "component", type: OverflowMenuComponent, selector: "v-overflow-menu", inputs: ["open", "placement", "menuWidth", "offsetX", "offsetY", "closeOnSelect", "useHostAsReference", "portalToBody"], outputs: ["openChange"] }, { kind: "component", type: OverflowMenuOptionComponent, selector: "v-overflow-menu-option", inputs: ["disabled", "type", "testId", "optionId"], outputs: ["selected"] }, { kind: "component", type: OverflowMenuTriggerComponent, selector: "v-overflow-menu-trigger", inputs: ["compact"] }, { kind: "component", type: CarbonTagsModalComponent, selector: "valtimo-tags-modal", inputs: ["open", "tags"], outputs: ["closeEvent"] }, { kind: "pipe", type: i1$4.AsyncPipe, name: "async" }, { kind: "pipe", type: i1.TranslatePipe, name: "translate" }, { kind: "pipe", type: ActionItemDisabledPipe, name: "actionItemDisabled" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.25", ngImport: i0, type: CarbonListComponent, decorators: [{
             type: Component,
@@ -7360,6 +7455,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.25", ngImpo
                 type: Input
             }], expandedRowKey: [{
                 type: Input
+            }], trackByKey: [{
+                type: Input
             }], rowClicked: [{
                 type: Output
             }], paginationClicked: [{
@@ -10454,7 +10551,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.25", ngImpo
             }] } });
 
 /*
- * Copyright 2015-2025 Ritense BV, the Netherlands.
+ * Copyright 2015-2026 Ritense BV, the Netherlands.
  *
  * Licensed under EUPL, Version 1.2 (the "License");
  * you may not use this file except in compliance with the License.
@@ -10503,6 +10600,12 @@ class TooltipDirective {
             this.overlayRef.detach();
         }
     }
+    ngOnDestroy() {
+        // The overlay lives outside the host element. When the host is destroyed while the tooltip is
+        // shown (e.g. a page removing the hovered element), no mouseleave ever fires, so without
+        // disposal the tooltip stays on screen forever.
+        this.overlayRef?.dispose();
+    }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.25", ngImport: i0, type: TooltipDirective, deps: [{ token: i1$6.Overlay }, { token: i1$6.OverlayPositionBuilder }, { token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Directive }); }
     static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "19.2.25", type: TooltipDirective, isStandalone: false, selector: "[vTooltip]", inputs: { text: ["vTooltip", "text"], onBottom: "onBottom", tooltipDisabled: "tooltipDisabled" }, host: { listeners: { "mouseenter": "show()", "mouseleave": "hide()" } }, ngImport: i0 }); }
 }
@@ -13718,7 +13821,7 @@ class ObjectManagementSelectComponent {
         this.valueChange.emit(this.accumulatedSelections);
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.25", ngImport: i0, type: ObjectManagementSelectComponent, deps: [{ token: ObjectManagementSelectService }, { token: i2$3.IconService }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.25", type: ObjectManagementSelectComponent, isStandalone: true, selector: "valtimo-object-management-select", inputs: { disabled: "disabled", label: "label", validate: "validate", valueFormat: "valueFormat", objectManagementId: "objectManagementId", objectManagementTitle: "objectManagementTitle", columns: "columns", pageSize: "pageSize", value: "value" }, outputs: { valueChange: "valueChange" }, viewQueries: [{ propertyName: "_carbonList", first: true, predicate: ["carbonList"], descendants: true }, { propertyName: "_selectionList", first: true, predicate: ["selectionList"], descendants: true }], ngImport: i0, template: "<!--\n * Copyright 2015-2026 Ritense BV, the Netherlands.\n *\n * Licensed under EUPL, Version 1.2 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n * https://joinup.ec.europa.eu/collection/eupl/eupl-text-eupl-12\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" basis,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n -->\n\n<ng-template #textFilter let-col>\n  <div class=\"search-field-container\">\n    <v-input\n      [name]=\"col.path\"\n      [title]=\"col.label | translate\"\n      [fullWidth]=\"true\"\n      [smallLabel]=\"true\"\n      [disabled]=\"disabled\"\n      [defaultValue]=\"filterValues[col.path] || ''\"\n      [clear$]=\"clearInputs$\"\n      (valueChange)=\"filterValues[col.path] = $event\"\n      (keyup.enter)=\"onSearch()\"\n    ></v-input>\n  </div>\n</ng-template>\n\n<ng-template #dropdownFilter let-col>\n  <div class=\"search-field-container\">\n    <v-input-label [title]=\"col.label | translate\" [small]=\"true\"></v-input-label>\n    <v-select\n      [items]=\"dropdownOptionsMap[col.path]\"\n      [margin]=\"false\"\n      [required]=\"false\"\n      [name]=\"col.path\"\n      [disabled]=\"disabled\"\n      [defaultSelectionId]=\"filterValues[col.path] ?? null\"\n      [clearSelectionSubject$]=\"clearSelects$\"\n      (selectedChange)=\"filterValues[col.path] = $event\"\n      [appendInline]=\"false\"\n    ></v-select>\n  </div>\n</ng-template>\n\n<ng-template #dateFilter let-col>\n  <div class=\"search-field-container\">\n    <v-date-picker\n      [title]=\"col.label | translate\"\n      [name]=\"col.path\"\n      fullWidth=\"true\"\n      [smallLabel]=\"true\"\n      [disabled]=\"disabled\"\n      [defaultDate]=\"filterValues[col.path] || ''\"\n      [clear$]=\"clearInputs$\"\n      (valueChange)=\"filterValues[col.path] = $event\"\n      (keyup.enter)=\"onSearch()\"\n    ></v-date-picker>\n  </div>\n</ng-template>\n\n<ng-template #dateRangeFilter let-col>\n  <div class=\"search-field-container search-field-container--full\">\n    <v-input-label [title]=\"col.label | translate\" [small]=\"true\"></v-input-label>\n    <div class=\"date-range-fields\">\n      <v-date-picker\n        [name]=\"col.path + '_start'\"\n        fullWidth=\"true\"\n        [disabled]=\"disabled\"\n        [defaultDate]=\"filterValues[col.path + '_start'] || ''\"\n        [clear$]=\"clearInputs$\"\n        (valueChange)=\"filterValues[col.path + '_start'] = $event\"\n        (keyup.enter)=\"onSearch()\"\n      ></v-date-picker>\n      <span class=\"to-text\">{{ 'searchFields.to' | translate }}</span>\n      <v-date-picker\n        [name]=\"col.path + '_end'\"\n        fullWidth=\"true\"\n        [disabled]=\"disabled\"\n        [defaultDate]=\"filterValues[col.path + '_end'] || ''\"\n        [clear$]=\"clearInputs$\"\n        (valueChange)=\"filterValues[col.path + '_end'] = $event\"\n        (keyup.enter)=\"onSearch()\"\n      ></v-date-picker>\n    </div>\n  </div>\n</ng-template>\n\n<div class=\"object-management-select\" data-test-id=\"object-management-select\">\n  <cds-accordion *ngIf=\"showFilters\" class=\"filter-accordion\">\n    <cds-accordion-item [title]=\"'searchFields.searchButtonText' | translate\" [expanded]=\"filtersExpanded\">\n      <div class=\"search-fields-container\">\n        <ng-container *ngFor=\"let col of filterableColumns\">\n          <ng-container *ngIf=\"col.inputType === 'text' || !col.inputType\">\n            <ng-container *ngTemplateOutlet=\"textFilter; context: { $implicit: col }\"></ng-container>\n          </ng-container>\n          <ng-container *ngIf=\"col.inputType === 'dropdown'\">\n            <ng-container *ngTemplateOutlet=\"dropdownFilter; context: { $implicit: col }\"></ng-container>\n          </ng-container>\n          <ng-container *ngIf=\"col.inputType === 'date'\">\n            <ng-container *ngTemplateOutlet=\"dateFilter; context: { $implicit: col }\"></ng-container>\n          </ng-container>\n          <ng-container *ngIf=\"col.inputType === 'dateRange'\">\n            <ng-container *ngTemplateOutlet=\"dateRangeFilter; context: { $implicit: col }\"></ng-container>\n          </ng-container>\n        </ng-container>\n      </div>\n\n      <div class=\"buttons-container\">\n        <button type=\"button\" cdsButton=\"tertiary\" (click)=\"onClearFilters()\" [disabled]=\"disabled\">\n          {{ 'searchFields.clearButtonText' | translate }}\n        </button>\n        <button type=\"button\" cdsButton=\"primary\" (click)=\"onSearch()\" [disabled]=\"disabled\">\n          {{ 'searchFields.searchButtonText' | translate }}\n        </button>\n      </div>\n    </cds-accordion-item>\n  </cds-accordion>\n\n  <valtimo-carbon-list\n    #carbonList\n    [fields]=\"tableFields\"\n    [items]=\"tableItems\"\n    [loading]=\"loading\"\n    [skeletonRowCount]=\"2\"\n    [header]=\"false\"\n    [hideToolbar]=\"false\"\n    [isSearchable]=\"false\"\n    [showSelectionColumn]=\"true\"\n    [pagination]=\"pagination\"\n    [initialSortState]=\"initialSortState\"\n    (sortChanged)=\"onSort($event)\"\n    (paginationClicked)=\"onPageChange($event)\"\n    (paginationSet)=\"onPageSizeChange($event)\"\n    data-test-id=\"object-management-select-list\"\n  >\n    <button\n      type=\"button\"\n      carbonToolbarContent\n      cdsButton=\"ghost\"\n      [title]=\"'searchFields.searchButtonText' | translate\"\n      (click)=\"loadData()\"\n      [disabled]=\"loading\"\n    >\n      <svg cdsIcon=\"search\" size=\"16\"></svg>\n    </button>\n    <button\n      type=\"button\"\n      carbonToolbarActions\n      cdsButton=\"primary\"\n      (click)=\"onAddSelection()\"\n      [disabled]=\"disabled || !canAddMore\"\n      data-test-id=\"object-management-select-add-button\"\n    >\n      {{ 'interface.add' | translate }}\n    </button>\n  </valtimo-carbon-list>\n\n  <div class=\"selections-section\" *ngIf=\"accumulatedSelections.length > 0\">\n    <valtimo-carbon-list\n      #selectionList\n      [fields]=\"selectionFields\"\n      [items]=\"selectionTableItems\"\n      [header]=\"true\"\n      [hideToolbar]=\"false\"\n      [isSearchable]=\"false\"\n      [showSelectionColumn]=\"true\"\n      (sortChanged)=\"onSelectionSort($event)\"\n      data-test-id=\"object-management-select-selections\"\n    >\n      <span header>{{ 'interface.list.multipleSelect' | translate:{count: accumulatedSelections.length} }}</span>\n      <button\n        type=\"button\"\n        carbonToolbarContent\n        cdsButton=\"ghost\"\n        (click)=\"onClearSelections()\"\n        [disabled]=\"disabled\"\n      >\n        {{ 'interface.clearAll' | translate }}\n      </button>\n      <button\n        type=\"button\"\n        carbonToolbarActions\n        cdsButton=\"danger\"\n        (click)=\"onRemoveSelectedSelections()\"\n        [disabled]=\"disabled\"\n        data-test-id=\"object-management-select-remove-button\"\n      >\n        {{ 'interface.delete' | translate }}\n      </button>\n    </valtimo-carbon-list>\n  </div>\n</div>\n", styles: [".object-management-select{display:flex;flex-direction:column;gap:0}.filter-accordion ::ng-deep .cds--accordion{background-color:var(--cds-layer)}.filter-accordion ::ng-deep .cds--accordion__item{border-inline-start:1px solid var(--cds-border-subtle);border-inline-end:1px solid var(--cds-border-subtle);border-block-start:1px solid var(--cds-border-subtle);border-block-end:none}.filter-accordion ::ng-deep .cds--accordion__heading{height:48px}.filter-accordion ::ng-deep .cds--accordion__content{padding:0 16px}::ng-deep .cds--table-toolbar{background-color:var(--cds-layer);border-inline-start:1px solid var(--cds-border-subtle);border-inline-end:1px solid var(--cds-border-subtle)}.search-fields-container{padding-bottom:16px;padding-top:16px;display:grid;gap:16px;grid-template-columns:repeat(2,1fr)}@media(max-width:480px){.search-fields-container{grid-template-columns:1fr}}.search-field-container--full{grid-column:span 2}@media(max-width:480px){.search-field-container--full{grid-column:span 1}}.date-range-fields{display:grid;grid-template-columns:5fr 2fr 5fr;align-items:center;gap:8px}@media(max-width:480px){.date-range-fields{grid-template-columns:1fr}}.to-text{text-align:center}.buttons-container{width:100%;display:flex;justify-content:flex-end;gap:16px;padding-bottom:16px}.selections-section{margin-top:1rem}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$4.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1$4.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1$4.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "ngmodule", type: FormsModule }, { kind: "ngmodule", type: CarbonListModule }, { kind: "component", type: CarbonListComponent, selector: "valtimo-carbon-list", inputs: ["items", "fields", "tableTranslations", "paginatorConfig", "pagination", "loading", "skeletonRowCount", "actions", "actionItems", "showActionItems", "header", "hideColumnHeader", "initialSortState", "sortState", "isSearchable", "initialSearchValue", "searchDebounceMs", "invalidSearchFields", "searchFields", "enableSingleSelection", "lastColumnTemplate", "paginationIdentifier", "showSelectionColumn", "striped", "hideToolbar", "lockedTooltipTranslationKey", "movingRowsEnabled", "dragAndDrop", "dragAndDropDisabled", "expandedRowTemplate", "expandedRowKey"], outputs: ["rowClicked", "paginationClicked", "paginationSet", "search", "sortChanged", "moveRow", "itemsReordered"] }, { kind: "ngmodule", type: AccordionModule }, { kind: "component", type: i2$3.Accordion, selector: "cds-accordion, ibm-accordion", inputs: ["align", "size", "skeleton"] }, { kind: "component", type: i2$3.AccordionItem, selector: "cds-accordion-item, ibm-accordion-item", inputs: ["title", "context", "id", "skeleton", "expanded", "disabled"], outputs: ["selected"] }, { kind: "ngmodule", type: ButtonModule }, { kind: "directive", type: i2$3.Button, selector: "[cdsButton], [ibmButton]", inputs: ["ibmButton", "cdsButton", "size", "skeleton", "iconOnly", "isExpressive"] }, { kind: "ngmodule", type: IconModule }, { kind: "directive", type: i2$3.IconDirective, selector: "[cdsIcon], [ibmIcon]", inputs: ["ibmIcon", "cdsIcon", "size", "title", "ariaLabel", "ariaLabelledBy", "ariaHidden", "isFocusable"] }, { kind: "ngmodule", type: TranslateModule }, { kind: "pipe", type: i1.TranslatePipe, name: "translate" }, { kind: "ngmodule", type: InputModule }, { kind: "component", type: InputComponent, selector: "v-input", inputs: ["name", "type", "title", "titleTranslationKey", "defaultValue", "widthPx", "fullWidth", "margin", "smallMargin", "disabled", "step", "min", "maxLength", "tooltip", "required", "hideNumberSpinBox", "smallLabel", "rows", "clear$", "carbonTheme", "placeholder", "dataTestId", "trim", "presetsTitle", "presetOptions"], outputs: ["valueChange"] }, { kind: "ngmodule", type: InputLabelModule }, { kind: "component", type: InputLabelComponent, selector: "v-input-label", inputs: ["name", "tooltip", "tooltipTranslationKey", "largeMargin", "small", "noMargin", "title", "titleTranslationKey", "required", "disabled", "carbonTheme"] }, { kind: "ngmodule", type: SelectModule }, { kind: "component", type: SelectComponent, selector: "v-select", inputs: ["items", "defaultSelection", "defaultSelectionId", "defaultSelectionIds", "disabled", "dropUp", "invalid", "multiple", "margin", "widthInPx", "notFoundText", "clearAllText", "clearText", "clearable", "name", "title", "titleTranslationKey", "clearSelectionSubject$", "tooltip", "required", "loading", "loadingText", "placeholder", "smallMargin", "carbonTheme", "appendInline", "warn", "warnText", "dataTestId"], outputs: ["selectedChange"] }, { kind: "ngmodule", type: DatePickerModule }, { kind: "component", type: DatePickerComponent, selector: "v-date-picker", inputs: ["name", "title", "placeholder", "titleTranslationKey", "widthPx", "fullWidth", "margin", "disabled", "tooltip", "required", "defaultDate", "defaultDateIsToday", "smallLabel", "clear$", "enableTime", "carbonTheme"], outputs: ["valueChange"] }] }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.25", type: ObjectManagementSelectComponent, isStandalone: true, selector: "valtimo-object-management-select", inputs: { disabled: "disabled", label: "label", validate: "validate", valueFormat: "valueFormat", objectManagementId: "objectManagementId", objectManagementTitle: "objectManagementTitle", columns: "columns", pageSize: "pageSize", value: "value" }, outputs: { valueChange: "valueChange" }, viewQueries: [{ propertyName: "_carbonList", first: true, predicate: ["carbonList"], descendants: true }, { propertyName: "_selectionList", first: true, predicate: ["selectionList"], descendants: true }], ngImport: i0, template: "<!--\n * Copyright 2015-2026 Ritense BV, the Netherlands.\n *\n * Licensed under EUPL, Version 1.2 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n * https://joinup.ec.europa.eu/collection/eupl/eupl-text-eupl-12\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" basis,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n -->\n\n<ng-template #textFilter let-col>\n  <div class=\"search-field-container\">\n    <v-input\n      [name]=\"col.path\"\n      [title]=\"col.label | translate\"\n      [fullWidth]=\"true\"\n      [smallLabel]=\"true\"\n      [disabled]=\"disabled\"\n      [defaultValue]=\"filterValues[col.path] || ''\"\n      [clear$]=\"clearInputs$\"\n      (valueChange)=\"filterValues[col.path] = $event\"\n      (keyup.enter)=\"onSearch()\"\n    ></v-input>\n  </div>\n</ng-template>\n\n<ng-template #dropdownFilter let-col>\n  <div class=\"search-field-container\">\n    <v-input-label [title]=\"col.label | translate\" [small]=\"true\"></v-input-label>\n    <v-select\n      [items]=\"dropdownOptionsMap[col.path]\"\n      [margin]=\"false\"\n      [required]=\"false\"\n      [name]=\"col.path\"\n      [disabled]=\"disabled\"\n      [defaultSelectionId]=\"filterValues[col.path] ?? null\"\n      [clearSelectionSubject$]=\"clearSelects$\"\n      (selectedChange)=\"filterValues[col.path] = $event\"\n      [appendInline]=\"false\"\n    ></v-select>\n  </div>\n</ng-template>\n\n<ng-template #dateFilter let-col>\n  <div class=\"search-field-container\">\n    <v-date-picker\n      [title]=\"col.label | translate\"\n      [name]=\"col.path\"\n      fullWidth=\"true\"\n      [smallLabel]=\"true\"\n      [disabled]=\"disabled\"\n      [defaultDate]=\"filterValues[col.path] || ''\"\n      [clear$]=\"clearInputs$\"\n      (valueChange)=\"filterValues[col.path] = $event\"\n      (keyup.enter)=\"onSearch()\"\n    ></v-date-picker>\n  </div>\n</ng-template>\n\n<ng-template #dateRangeFilter let-col>\n  <div class=\"search-field-container search-field-container--full\">\n    <v-input-label [title]=\"col.label | translate\" [small]=\"true\"></v-input-label>\n    <div class=\"date-range-fields\">\n      <v-date-picker\n        [name]=\"col.path + '_start'\"\n        fullWidth=\"true\"\n        [disabled]=\"disabled\"\n        [defaultDate]=\"filterValues[col.path + '_start'] || ''\"\n        [clear$]=\"clearInputs$\"\n        (valueChange)=\"filterValues[col.path + '_start'] = $event\"\n        (keyup.enter)=\"onSearch()\"\n      ></v-date-picker>\n      <span class=\"to-text\">{{ 'searchFields.to' | translate }}</span>\n      <v-date-picker\n        [name]=\"col.path + '_end'\"\n        fullWidth=\"true\"\n        [disabled]=\"disabled\"\n        [defaultDate]=\"filterValues[col.path + '_end'] || ''\"\n        [clear$]=\"clearInputs$\"\n        (valueChange)=\"filterValues[col.path + '_end'] = $event\"\n        (keyup.enter)=\"onSearch()\"\n      ></v-date-picker>\n    </div>\n  </div>\n</ng-template>\n\n<div class=\"object-management-select\" data-test-id=\"object-management-select\">\n  <cds-accordion *ngIf=\"showFilters\" class=\"filter-accordion\">\n    <cds-accordion-item [title]=\"'searchFields.searchButtonText' | translate\" [expanded]=\"filtersExpanded\">\n      <div class=\"search-fields-container\">\n        <ng-container *ngFor=\"let col of filterableColumns\">\n          <ng-container *ngIf=\"col.inputType === 'text' || !col.inputType\">\n            <ng-container *ngTemplateOutlet=\"textFilter; context: { $implicit: col }\"></ng-container>\n          </ng-container>\n          <ng-container *ngIf=\"col.inputType === 'dropdown'\">\n            <ng-container *ngTemplateOutlet=\"dropdownFilter; context: { $implicit: col }\"></ng-container>\n          </ng-container>\n          <ng-container *ngIf=\"col.inputType === 'date'\">\n            <ng-container *ngTemplateOutlet=\"dateFilter; context: { $implicit: col }\"></ng-container>\n          </ng-container>\n          <ng-container *ngIf=\"col.inputType === 'dateRange'\">\n            <ng-container *ngTemplateOutlet=\"dateRangeFilter; context: { $implicit: col }\"></ng-container>\n          </ng-container>\n        </ng-container>\n      </div>\n\n      <div class=\"buttons-container\">\n        <button type=\"button\" cdsButton=\"tertiary\" (click)=\"onClearFilters()\" [disabled]=\"disabled\">\n          {{ 'searchFields.clearButtonText' | translate }}\n        </button>\n        <button type=\"button\" cdsButton=\"primary\" (click)=\"onSearch()\" [disabled]=\"disabled\">\n          {{ 'searchFields.searchButtonText' | translate }}\n        </button>\n      </div>\n    </cds-accordion-item>\n  </cds-accordion>\n\n  <valtimo-carbon-list\n    #carbonList\n    [fields]=\"tableFields\"\n    [items]=\"tableItems\"\n    [loading]=\"loading\"\n    [skeletonRowCount]=\"2\"\n    [header]=\"false\"\n    [hideToolbar]=\"false\"\n    [isSearchable]=\"false\"\n    [showSelectionColumn]=\"true\"\n    [pagination]=\"pagination\"\n    [initialSortState]=\"initialSortState\"\n    (sortChanged)=\"onSort($event)\"\n    (paginationClicked)=\"onPageChange($event)\"\n    (paginationSet)=\"onPageSizeChange($event)\"\n    data-test-id=\"object-management-select-list\"\n  >\n    <button\n      type=\"button\"\n      carbonToolbarContent\n      cdsButton=\"ghost\"\n      [title]=\"'searchFields.searchButtonText' | translate\"\n      (click)=\"loadData()\"\n      [disabled]=\"loading\"\n    >\n      <svg cdsIcon=\"search\" size=\"16\"></svg>\n    </button>\n    <button\n      type=\"button\"\n      carbonToolbarActions\n      cdsButton=\"primary\"\n      (click)=\"onAddSelection()\"\n      [disabled]=\"disabled || !canAddMore\"\n      data-test-id=\"object-management-select-add-button\"\n    >\n      {{ 'interface.add' | translate }}\n    </button>\n  </valtimo-carbon-list>\n\n  <div class=\"selections-section\" *ngIf=\"accumulatedSelections.length > 0\">\n    <valtimo-carbon-list\n      #selectionList\n      [fields]=\"selectionFields\"\n      [items]=\"selectionTableItems\"\n      [header]=\"true\"\n      [hideToolbar]=\"false\"\n      [isSearchable]=\"false\"\n      [showSelectionColumn]=\"true\"\n      (sortChanged)=\"onSelectionSort($event)\"\n      data-test-id=\"object-management-select-selections\"\n    >\n      <span header>{{ 'interface.list.multipleSelect' | translate:{count: accumulatedSelections.length} }}</span>\n      <button\n        type=\"button\"\n        carbonToolbarContent\n        cdsButton=\"ghost\"\n        (click)=\"onClearSelections()\"\n        [disabled]=\"disabled\"\n      >\n        {{ 'interface.clearAll' | translate }}\n      </button>\n      <button\n        type=\"button\"\n        carbonToolbarActions\n        cdsButton=\"danger\"\n        (click)=\"onRemoveSelectedSelections()\"\n        [disabled]=\"disabled\"\n        data-test-id=\"object-management-select-remove-button\"\n      >\n        {{ 'interface.delete' | translate }}\n      </button>\n    </valtimo-carbon-list>\n  </div>\n</div>\n", styles: [".object-management-select{display:flex;flex-direction:column;gap:0}.filter-accordion ::ng-deep .cds--accordion{background-color:var(--cds-layer)}.filter-accordion ::ng-deep .cds--accordion__item{border-inline-start:1px solid var(--cds-border-subtle);border-inline-end:1px solid var(--cds-border-subtle);border-block-start:1px solid var(--cds-border-subtle);border-block-end:none}.filter-accordion ::ng-deep .cds--accordion__heading{height:48px}.filter-accordion ::ng-deep .cds--accordion__content{padding:0 16px}::ng-deep .cds--table-toolbar{background-color:var(--cds-layer);border-inline-start:1px solid var(--cds-border-subtle);border-inline-end:1px solid var(--cds-border-subtle)}.search-fields-container{padding-bottom:16px;padding-top:16px;display:grid;gap:16px;grid-template-columns:repeat(2,1fr)}@media(max-width:480px){.search-fields-container{grid-template-columns:1fr}}.search-field-container--full{grid-column:span 2}@media(max-width:480px){.search-field-container--full{grid-column:span 1}}.date-range-fields{display:grid;grid-template-columns:5fr 2fr 5fr;align-items:center;gap:8px}@media(max-width:480px){.date-range-fields{grid-template-columns:1fr}}.to-text{text-align:center}.buttons-container{width:100%;display:flex;justify-content:flex-end;gap:16px;padding-bottom:16px}.selections-section{margin-top:1rem}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$4.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1$4.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1$4.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "ngmodule", type: FormsModule }, { kind: "ngmodule", type: CarbonListModule }, { kind: "component", type: CarbonListComponent, selector: "valtimo-carbon-list", inputs: ["items", "fields", "tableTranslations", "paginatorConfig", "pagination", "loading", "skeletonRowCount", "actions", "actionItems", "showActionItems", "header", "hideColumnHeader", "initialSortState", "sortState", "isSearchable", "initialSearchValue", "searchDebounceMs", "invalidSearchFields", "searchFields", "enableSingleSelection", "lastColumnTemplate", "paginationIdentifier", "showSelectionColumn", "striped", "hideToolbar", "lockedTooltipTranslationKey", "movingRowsEnabled", "dragAndDrop", "dragAndDropDisabled", "expandedRowTemplate", "expandedRowKey", "trackByKey"], outputs: ["rowClicked", "paginationClicked", "paginationSet", "search", "sortChanged", "moveRow", "itemsReordered"] }, { kind: "ngmodule", type: AccordionModule }, { kind: "component", type: i2$3.Accordion, selector: "cds-accordion, ibm-accordion", inputs: ["align", "size", "skeleton"] }, { kind: "component", type: i2$3.AccordionItem, selector: "cds-accordion-item, ibm-accordion-item", inputs: ["title", "context", "id", "skeleton", "expanded", "disabled"], outputs: ["selected"] }, { kind: "ngmodule", type: ButtonModule }, { kind: "directive", type: i2$3.Button, selector: "[cdsButton], [ibmButton]", inputs: ["ibmButton", "cdsButton", "size", "skeleton", "iconOnly", "isExpressive"] }, { kind: "ngmodule", type: IconModule }, { kind: "directive", type: i2$3.IconDirective, selector: "[cdsIcon], [ibmIcon]", inputs: ["ibmIcon", "cdsIcon", "size", "title", "ariaLabel", "ariaLabelledBy", "ariaHidden", "isFocusable"] }, { kind: "ngmodule", type: TranslateModule }, { kind: "pipe", type: i1.TranslatePipe, name: "translate" }, { kind: "ngmodule", type: InputModule }, { kind: "component", type: InputComponent, selector: "v-input", inputs: ["name", "type", "title", "titleTranslationKey", "defaultValue", "widthPx", "fullWidth", "margin", "smallMargin", "disabled", "step", "min", "maxLength", "tooltip", "required", "hideNumberSpinBox", "smallLabel", "rows", "clear$", "carbonTheme", "placeholder", "dataTestId", "trim", "presetsTitle", "presetOptions"], outputs: ["valueChange"] }, { kind: "ngmodule", type: InputLabelModule }, { kind: "component", type: InputLabelComponent, selector: "v-input-label", inputs: ["name", "tooltip", "tooltipTranslationKey", "largeMargin", "small", "noMargin", "title", "titleTranslationKey", "required", "disabled", "carbonTheme"] }, { kind: "ngmodule", type: SelectModule }, { kind: "component", type: SelectComponent, selector: "v-select", inputs: ["items", "defaultSelection", "defaultSelectionId", "defaultSelectionIds", "disabled", "dropUp", "invalid", "multiple", "margin", "widthInPx", "notFoundText", "clearAllText", "clearText", "clearable", "name", "title", "titleTranslationKey", "clearSelectionSubject$", "tooltip", "required", "loading", "loadingText", "placeholder", "smallMargin", "carbonTheme", "appendInline", "warn", "warnText", "dataTestId"], outputs: ["selectedChange"] }, { kind: "ngmodule", type: DatePickerModule }, { kind: "component", type: DatePickerComponent, selector: "v-date-picker", inputs: ["name", "title", "placeholder", "titleTranslationKey", "widthPx", "fullWidth", "margin", "disabled", "tooltip", "required", "defaultDate", "defaultDateIsToday", "smallLabel", "clear$", "enableTime", "carbonTheme"], outputs: ["valueChange"] }] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.25", ngImport: i0, type: ObjectManagementSelectComponent, decorators: [{
             type: Component,