@valtimo/components 13.38.0 → 13.40.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';
@@ -32,7 +32,7 @@ import * as i4 from 'ngx-logger';
 import * as i6$1 from '@valtimo/security';
 import * as i11 from '@ng-bootstrap/ng-bootstrap';
 import { NgbTooltipModule, NgbPaginationModule } from '@ng-bootstrap/ng-bootstrap';
-import { autoUpdate, computePosition, offset, flip, shift } from '@floating-ui/dom';
+import { autoUpdate, computePosition, offset, flip, shift, hide } from '@floating-ui/dom';
 import * as i3 from '@angular/cdk/layout';
 import { LayoutModule } from '@angular/cdk/layout';
 import { OverflowMenuVertical16, ArrowDown16, ArrowUp16, SettingsView16, Draggable16, View16, ViewOff16, ChevronUp16, ChevronDown16, Close16, Add16, Edit16, Save16, WarningAltFilled16, WarningFilled16, TrashCan16, DocumentRequirements16, UserFollow16, Group16, User16 } from '@carbon/icons';
@@ -4567,6 +4567,9 @@ class OverflowMenuComponent {
         const menu = this._portalledPane || this.menuContainer?.nativeElement;
         if (!reference || !menu)
             return;
+        // Keep the pane invisible until the first position has been computed, so
+        // it never flashes at an unpositioned location.
+        menu.style.visibility = 'hidden';
         this._cleanupAutoUpdate = autoUpdate(reference, menu, () => {
             computePosition(reference, menu, {
                 // The pane is rendered with `position: fixed`, so positions must be
@@ -4578,11 +4581,16 @@ class OverflowMenuComponent {
                     offset({ mainAxis: this.offsetY, crossAxis: this.offsetX }),
                     flip(),
                     shift({ padding: 8 }),
+                    hide(),
                 ],
-            }).then(({ x, y }) => {
+            }).then(({ x, y, middlewareData }) => {
                 Object.assign(menu.style, {
                     left: `${x}px`,
                     top: `${y}px`,
+                    // When the trigger is scrolled out of its clipping container (e.g. a
+                    // horizontally scrolled table), hide the pane instead of leaving it
+                    // floating detached over unrelated content.
+                    visibility: middlewareData.hide?.referenceHidden ? 'hidden' : 'visible',
                 });
             });
         });
@@ -5254,6 +5262,14 @@ class LeftSidebarComponent {
         this._breakpointSubscription?.unsubscribe();
         this._menuCollapsedByDefaultSubscription?.unsubscribe();
     }
+    /**
+     * Keeps menu item views stable across menu reloads, so that the expanded state of
+     * `cds-sidenav-menu` (which is internal to the Carbon component) survives a reload.
+     * Keyed on the link, since titles are not guaranteed to be unique.
+     */
+    trackByMenuItem(_index, menuItem) {
+        return Array.isArray(menuItem.link) ? menuItem.link.join('/') : menuItem.title;
+    }
     navigateToRoute(route, event) {
         event.preventDefault();
         this.overflowMenuSequence$.next('');
@@ -5330,11 +5346,11 @@ class LeftSidebarComponent {
         });
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.25", ngImport: i0, type: LeftSidebarComponent, deps: [{ token: i0.ElementRef }, { token: MenuService }, { token: ShellService }, { token: i3.BreakpointObserver }, { token: i1$3.Router }, { token: i1$2.ConfigService }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.25", type: LeftSidebarComponent, isStandalone: false, selector: "valtimo-left-sidebar", host: { listeners: { "document:click": "onPageClick($event.target)" } }, viewQueries: [{ propertyName: "toggleButtonRef", first: true, predicate: ["toggleButton"], descendants: true }], ngImport: i0, template: "<!--\n  ~ Copyright 2015-2025 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-sidenav\n  *ngIf=\"{\n    closestSequence: closestSequence$ | async,\n    overflowMenuSequence: overflowMenuSequence$ | async,\n    sideBarExpanded: sideBarExpanded$ | async,\n    menuItemsLoaded: menuItemsLoaded$ | async,\n    menuItems: menuItems$ | async,\n  } as obs\"\n  [allowExpansion]=\"false\"\n  [expanded]=\"obs.sideBarExpanded\"\n>\n  <ng-container *ngIf=\"obs.menuItemsLoaded; else loadingTemplate\">\n    <ng-container *ngFor=\"let menuItem of obs.menuItems\">\n      <ng-container *ngIf=\"!menuItem.children\">\n        <ng-container\n          *ngTemplateOutlet=\"\n            topMenuItem;\n            context: {\n              menuItem: menuItem,\n              closestSequence: obs.closestSequence,\n              overflowMenuSequence: obs.overflowMenuSequence,\n            }\n          \"\n        ></ng-container>\n      </ng-container>\n\n      <ng-container *ngIf=\"menuItem.children\">\n        <ng-container\n          *ngTemplateOutlet=\"\n            topMenuItem;\n            context: {\n              closestSequence: obs.closestSequence,\n              menuItem: menuItem,\n              overflowMenuSequence: obs.overflowMenuSequence,\n            }\n          \"\n        ></ng-container>\n\n        <div [ngClass]=\"{\n          'menu-item--hidden': menuItem.includeFunction !== undefined,\n          'menu-item--visible':\n            menuItem.includeFunction !== undefined &&\n            (includeFunctionObservables[menuItem.title] | async),\n        }\">\n          <ng-container *ngTemplateOutlet=\"subMenuIcon; context: {menuItem: menuItem}\"></ng-container>\n\n          <cds-sidenav-menu\n            [title]=\"menuItem | menuItemTranslate | async\"\n            [attr.data-testid]=\"'sidenav-item-' + menuItem.title\"\n          >\n            <ng-container *ngFor=\"let childMenuItem of menuItem.children\">\n              <ng-container\n                *ngIf=\"{\n                  disableCaseCount: disableCaseCount$ | async,\n                  count: childMenuItem?.count$ && (childMenuItem?.count$ | async),\n                  sequence: '' + menuItem.sequence + '.' + childMenuItem.sequence,\n                } as vars\"\n              >\n                <cds-sidenav-item\n                  [attr.data-testid]=\"'sidenav-item-' + childMenuItem?.title\"\n                  [title]=\"\n                    menuItem.title === 'Cases' || menuItem.title === 'Dossiers'\n                      ? (childMenuItem | menuItemTranslate | async)\n                      : null\n                  \"\n                  [ngClass]=\"{\n                    'cds--side-nav__item--empty': !childMenuItem.link,\n                    'menu-item--hidden': childMenuItem.includeFunction !== undefined,\n                    'menu-item--visible':\n                      childMenuItem.includeFunction !== undefined &&\n                      (includeFunctionObservables[childMenuItem.title] | async),\n                  }\"\n                  [active]=\"vars.sequence === obs.closestSequence\"\n                  [href]=\"vars?.count ? 'javascript:return false;' : 'javascript:void(0);'\"\n                  (click)=\"navigateToRoute(childMenuItem.link, $event)\"\n                  (contextmenu)=\"onRightClick(vars.sequence)\"\n                  (ctrl-click)=\"openInNewTab(childMenuItem.link)\"\n                >\n                  <valtimo-menu-item-text\n                    [accent]=\"!childMenuItem.link\"\n                    [menuItem]=\"childMenuItem\"\n                    [showOverFlowMenu]=\"obs.overflowMenuSequence === vars.sequence\"\n                    (openInNewTab)=\"openInNewTab(childMenuItem.link)\"\n                    (overflowMenuClosed)=\"onOverflowMenuClosed(vars.sequence)\"\n                  ></valtimo-menu-item-text>\n\n                  <ng-container\n                    *ngTemplateOutlet=\"countTemplate; context: {count: vars.count, disableCaseCount: vars.disableCaseCount}\"\n                  ></ng-container>\n                </cds-sidenav-item>\n              </ng-container>\n            </ng-container>\n          </cds-sidenav-menu>\n        </div>\n      </ng-container>\n    </ng-container>\n  </ng-container>\n</cds-sidenav>\n\n<ng-template #subMenuIcon let-menuItem=\"menuItem\">\n  <div class=\"menu-item-icon-container\"><i class=\"{{ menuItem.iconClass }}\"></i></div>\n</ng-template>\n\n<ng-template\n  #topMenuItem\n  let-closestSequence=\"closestSequence\"\n  let-menuItem=\"menuItem\"\n  let-overflowMenuSequence=\"overflowMenuSequence\"\n>\n  <ng-container *ngIf=\"{sequence: '' + menuItem.sequence} as vars\"\n    ><cds-sidenav-item\n      *ngIf=\"!menuItem.children\"\n      [attr.data-testid]=\"'sidenav-item-' + menuItem.title\"\n      [ngClass]=\"{\n        'menu-item--hidden': menuItem.includeFunction !== undefined,\n        'menu-item--visible':\n          menuItem.includeFunction !== undefined &&\n          (includeFunctionObservables[menuItem.title] | async),\n      }\"\n      [active]=\"vars.sequence === closestSequence\"\n      (click)=\"navigateToRoute(menuItem.link, $event)\"\n      (contextmenu)=\"onRightClick(vars.sequence)\"\n      (ctrl-click)=\"openInNewTab(menuItem.link.link)\"\n      href=\"javascript:void(0)\"\n    >\n      <valtimo-menu-item-text\n        [menuItem]=\"menuItem\"\n        [showOverFlowMenu]=\"overflowMenuSequence === vars.sequence\"\n        (openInNewTab)=\"openInNewTab(menuItem.link.link)\"\n        (overflowMenuClosed)=\"onOverflowMenuClosed(vars.sequence)\"\n      ></valtimo-menu-item-text>\n    </cds-sidenav-item>\n  </ng-container>\n</ng-template>\n\n<ng-template #countTemplate let-count=\"count\" let-disableCaseCount=\"disableCaseCount\">\n  <ng-container *ngIf=\"count && !disableCaseCount\">\n    <span class=\"case-count\">\n      {{ count | caseCount }}\n    </span>\n  </ng-container>\n</ng-template>\n\n<ng-template #loadingTemplate>\n  <div class=\"loading-container\">\n    <cds-loading size=\"sm\"></cds-loading>\n  </div>\n</ng-template>\n", styles: ["@media screen and (max-width:767px){.be-left-sidebar{width:100%!important}}.be-left-sidebar .left-sidebar-toggle{padding:20px}.be-left-sidebar .left-sidebar-toggle:before{font-size:1.615rem}.be-left-sidebar .sidebar-elements>li>a.be-toggle-left-sidebar{height:32px;display:flex;align-items:center}.be-left-sidebar .left-sidebar-content{padding-top:20px}.be-toggle-left-sidebar svg{margin-right:7px;min-width:21px;height:auto;overflow:visible}.be-toggle-left-sidebar svg path{transition:.27s ease;fill:#696969}::ng-deep .resize-border{position:absolute;width:3px;height:100%;top:0;right:0;cursor:col-resize;background-color:var(--cds-border-strong);opacity:0;transition:opacity .11s cubic-bezier(.2,0,1,.9)}::ng-deep .resize-hover{opacity:1}::ng-deep .resize-border--invisible{display:none}.no-transition{transition:none}.d-1{d:path(\"M3 18v-2h13v2z\")}.d-1-flipped{d:path(\"M3 18v-2h11v2z\")}.d-2{d:path(\"M3 13v-2h10v2H3\")}.d-2-flipped{d:path(\"M3 13v-2h12v2H3\")}.d-3{d:path(\"M3 6h13v2H3V6\")}.d-3-flipped{d:path(\"M3 6h11v2H3V6\")}.d-4{d:path(\"M21 15.61L19.59 17l-5.01-5 5.01-5L21 8.39 17.44 12 21 15.61\")}.d-4-flipped{d:path(\"M15.58 15.61L16.99 17 22 12l-5.01-5-1.41 1.39L19.14 12l-3.56 3.61\")}::ng-deep .cds--side-nav__menu{padding-left:0}::ng-deep .cds--side-nav__navigation{border-right:1px solid #e0e0e0;height:100%}::ng-deep .cds--side-nav--ux{width:0}::ng-deep .cds--side-nav--expanded{width:16rem}::ng-deep .cds--side-nav__header-divider{display:none!important}.menu-item-icon-container{position:relative;top:8px;left:13px;height:0}.menu-item-icon-container i{width:0px;height:16px}.menu-item--hidden{display:none}.menu-item--visible{display:block}::ng-deep .cds--side-nav__item--empty{pointer-events:none}::ng-deep .cds--side-nav__item--empty .menu-item-icon-container{display:none}::ng-deep .cds--side-nav__link[href*=\"javascript:return false;\"]{padding-right:3rem!important}.case-count{position:absolute;right:0;padding-right:1rem;height:100%;top:0;display:flex;align-items:center;justify-content:center;font-size:.875rem;letter-spacing:.1px;line-height:1.25rem;font-weight:500!important}::ng-deep .cds--side-nav__icon{margin-left:-16px}::ng-deep .cds--side-nav__item.cds--side-nav__item--icon a.cds--side-nav__link{padding-left:3.5rem}::ng-deep .cds--side-nav__submenu-title{padding-right:1.5rem}::ng-deep .cds--side-nav__items{display:flex!important;flex-direction:column!important;overflow:visible!important}::ng-deep .cds--side-nav__navigation{top:3rem;height:calc(100% - 3rem)!important;overflow-x:hidden!important;overflow-y:auto!important}::ng-deep .cds--side-nav__navigation:not(.cds--side-nav--expanded){width:0}.loading-container{display:flex;width:100%;justify-content:center}\n/*!\n * Copyright 2015-2025 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: i1$4.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: MenuItemTextComponent, selector: "valtimo-menu-item-text", inputs: ["menuItem", "accent", "showOverFlowMenu"], outputs: ["overflowMenuClosed", "openInNewTab"] }, { kind: "component", type: i2$3.SideNav, selector: "cds-sidenav, ibm-sidenav", inputs: ["ariaLabel", "expanded", "hidden", "rail", "allowExpansion", "navigationItems", "useRouter"] }, { kind: "component", type: i2$3.SideNavItem, selector: "cds-sidenav-item, ibm-sidenav-item", inputs: ["href", "useRouter", "active", "route", "isSubMenu", "routeExtras", "title"], outputs: ["navigation", "selected"] }, { kind: "component", type: i2$3.SideNavMenu, selector: "cds-sidenav-menu, ibm-sidenav-menu", inputs: ["useRouter", "title", "expanded", "hasActiveChild", "menuItems"] }, { kind: "directive", type: CtrlClickDirective, selector: "[ctrl-click]", outputs: ["ctrl-click"] }, { kind: "component", type: i2$3.Loading, selector: "cds-loading, ibm-loading", inputs: ["title", "isActive", "size", "overlay"] }, { kind: "pipe", type: i1$4.AsyncPipe, name: "async" }, { kind: "pipe", type: MenuItemTranslationPipe, name: "menuItemTranslate" }, { kind: "pipe", type: CaseCountPipe, name: "caseCount" }] }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.25", type: LeftSidebarComponent, isStandalone: false, selector: "valtimo-left-sidebar", host: { listeners: { "document:click": "onPageClick($event.target)" } }, viewQueries: [{ propertyName: "toggleButtonRef", first: true, predicate: ["toggleButton"], descendants: true }], ngImport: i0, template: "<!--\n  ~ Copyright 2015-2025 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-sidenav\n  *ngIf=\"{\n    closestSequence: closestSequence$ | async,\n    overflowMenuSequence: overflowMenuSequence$ | async,\n    sideBarExpanded: sideBarExpanded$ | async,\n    menuItemsLoaded: menuItemsLoaded$ | async,\n    menuItems: menuItems$ | async,\n  } as obs\"\n  [allowExpansion]=\"false\"\n  [expanded]=\"obs.sideBarExpanded\"\n>\n  <ng-container *ngIf=\"obs.menuItemsLoaded; else loadingTemplate\">\n    <ng-container *ngFor=\"let menuItem of obs.menuItems; trackBy: trackByMenuItem\">\n      <ng-container *ngIf=\"!menuItem.children\">\n        <ng-container\n          *ngTemplateOutlet=\"\n            topMenuItem;\n            context: {\n              menuItem: menuItem,\n              closestSequence: obs.closestSequence,\n              overflowMenuSequence: obs.overflowMenuSequence,\n            }\n          \"\n        ></ng-container>\n      </ng-container>\n\n      <ng-container *ngIf=\"menuItem.children\">\n        <ng-container\n          *ngTemplateOutlet=\"\n            topMenuItem;\n            context: {\n              closestSequence: obs.closestSequence,\n              menuItem: menuItem,\n              overflowMenuSequence: obs.overflowMenuSequence,\n            }\n          \"\n        ></ng-container>\n\n        <div [ngClass]=\"{\n          'menu-item--hidden': menuItem.includeFunction !== undefined,\n          'menu-item--visible':\n            menuItem.includeFunction !== undefined &&\n            (includeFunctionObservables[menuItem.title] | async),\n        }\">\n          <ng-container *ngTemplateOutlet=\"subMenuIcon; context: {menuItem: menuItem}\"></ng-container>\n\n          <cds-sidenav-menu\n            [title]=\"menuItem | menuItemTranslate | async\"\n            [attr.data-testid]=\"'sidenav-item-' + menuItem.title\"\n          >\n            <ng-container\n              *ngFor=\"let childMenuItem of menuItem.children; trackBy: trackByMenuItem\"\n            >\n              <ng-container\n                *ngIf=\"{\n                  disableCaseCount: disableCaseCount$ | async,\n                  count: childMenuItem?.count$ && (childMenuItem?.count$ | async),\n                  sequence: '' + menuItem.sequence + '.' + childMenuItem.sequence,\n                } as vars\"\n              >\n                <cds-sidenav-item\n                  [attr.data-testid]=\"'sidenav-item-' + childMenuItem?.title\"\n                  [title]=\"\n                    menuItem.title === 'Cases' || menuItem.title === 'Dossiers'\n                      ? (childMenuItem | menuItemTranslate | async)\n                      : null\n                  \"\n                  [ngClass]=\"{\n                    'cds--side-nav__item--empty': !childMenuItem.link,\n                    'menu-item--hidden': childMenuItem.includeFunction !== undefined,\n                    'menu-item--visible':\n                      childMenuItem.includeFunction !== undefined &&\n                      (includeFunctionObservables[childMenuItem.title] | async),\n                  }\"\n                  [active]=\"vars.sequence === obs.closestSequence\"\n                  [href]=\"vars?.count ? 'javascript:return false;' : 'javascript:void(0);'\"\n                  (click)=\"navigateToRoute(childMenuItem.link, $event)\"\n                  (contextmenu)=\"onRightClick(vars.sequence)\"\n                  (ctrl-click)=\"openInNewTab(childMenuItem.link)\"\n                >\n                  <valtimo-menu-item-text\n                    [accent]=\"!childMenuItem.link\"\n                    [menuItem]=\"childMenuItem\"\n                    [showOverFlowMenu]=\"obs.overflowMenuSequence === vars.sequence\"\n                    (openInNewTab)=\"openInNewTab(childMenuItem.link)\"\n                    (overflowMenuClosed)=\"onOverflowMenuClosed(vars.sequence)\"\n                  ></valtimo-menu-item-text>\n\n                  <ng-container\n                    *ngTemplateOutlet=\"countTemplate; context: {count: vars.count, disableCaseCount: vars.disableCaseCount}\"\n                  ></ng-container>\n                </cds-sidenav-item>\n              </ng-container>\n            </ng-container>\n          </cds-sidenav-menu>\n        </div>\n      </ng-container>\n    </ng-container>\n  </ng-container>\n</cds-sidenav>\n\n<ng-template #subMenuIcon let-menuItem=\"menuItem\">\n  <div class=\"menu-item-icon-container\"><i class=\"{{ menuItem.iconClass }}\"></i></div>\n</ng-template>\n\n<ng-template\n  #topMenuItem\n  let-closestSequence=\"closestSequence\"\n  let-menuItem=\"menuItem\"\n  let-overflowMenuSequence=\"overflowMenuSequence\"\n>\n  <ng-container *ngIf=\"{sequence: '' + menuItem.sequence} as vars\"\n    ><cds-sidenav-item\n      *ngIf=\"!menuItem.children\"\n      [attr.data-testid]=\"'sidenav-item-' + menuItem.title\"\n      [ngClass]=\"{\n        'menu-item--hidden': menuItem.includeFunction !== undefined,\n        'menu-item--visible':\n          menuItem.includeFunction !== undefined &&\n          (includeFunctionObservables[menuItem.title] | async),\n      }\"\n      [active]=\"vars.sequence === closestSequence\"\n      (click)=\"navigateToRoute(menuItem.link, $event)\"\n      (contextmenu)=\"onRightClick(vars.sequence)\"\n      (ctrl-click)=\"openInNewTab(menuItem.link.link)\"\n      href=\"javascript:void(0)\"\n    >\n      <valtimo-menu-item-text\n        [menuItem]=\"menuItem\"\n        [showOverFlowMenu]=\"overflowMenuSequence === vars.sequence\"\n        (openInNewTab)=\"openInNewTab(menuItem.link.link)\"\n        (overflowMenuClosed)=\"onOverflowMenuClosed(vars.sequence)\"\n      ></valtimo-menu-item-text>\n    </cds-sidenav-item>\n  </ng-container>\n</ng-template>\n\n<ng-template #countTemplate let-count=\"count\" let-disableCaseCount=\"disableCaseCount\">\n  <ng-container *ngIf=\"count && !disableCaseCount\">\n    <span class=\"case-count\">\n      {{ count | caseCount }}\n    </span>\n  </ng-container>\n</ng-template>\n\n<ng-template #loadingTemplate>\n  <div class=\"loading-container\">\n    <cds-loading size=\"sm\"></cds-loading>\n  </div>\n</ng-template>\n", styles: ["@media screen and (max-width:767px){.be-left-sidebar{width:100%!important}}.be-left-sidebar .left-sidebar-toggle{padding:20px}.be-left-sidebar .left-sidebar-toggle:before{font-size:1.615rem}.be-left-sidebar .sidebar-elements>li>a.be-toggle-left-sidebar{height:32px;display:flex;align-items:center}.be-left-sidebar .left-sidebar-content{padding-top:20px}.be-toggle-left-sidebar svg{margin-right:7px;min-width:21px;height:auto;overflow:visible}.be-toggle-left-sidebar svg path{transition:.27s ease;fill:#696969}::ng-deep .resize-border{position:absolute;width:3px;height:100%;top:0;right:0;cursor:col-resize;background-color:var(--cds-border-strong);opacity:0;transition:opacity .11s cubic-bezier(.2,0,1,.9)}::ng-deep .resize-hover{opacity:1}::ng-deep .resize-border--invisible{display:none}.no-transition{transition:none}.d-1{d:path(\"M3 18v-2h13v2z\")}.d-1-flipped{d:path(\"M3 18v-2h11v2z\")}.d-2{d:path(\"M3 13v-2h10v2H3\")}.d-2-flipped{d:path(\"M3 13v-2h12v2H3\")}.d-3{d:path(\"M3 6h13v2H3V6\")}.d-3-flipped{d:path(\"M3 6h11v2H3V6\")}.d-4{d:path(\"M21 15.61L19.59 17l-5.01-5 5.01-5L21 8.39 17.44 12 21 15.61\")}.d-4-flipped{d:path(\"M15.58 15.61L16.99 17 22 12l-5.01-5-1.41 1.39L19.14 12l-3.56 3.61\")}::ng-deep .cds--side-nav__menu{padding-left:0}::ng-deep .cds--side-nav__navigation{border-right:1px solid #e0e0e0;height:100%}::ng-deep .cds--side-nav--ux{width:0}::ng-deep .cds--side-nav--expanded{width:16rem}::ng-deep .cds--side-nav__header-divider{display:none!important}.menu-item-icon-container{position:relative;top:8px;left:13px;height:0}.menu-item-icon-container i{width:0px;height:16px}.menu-item--hidden{display:none}.menu-item--visible{display:block}::ng-deep .cds--side-nav__item--empty{pointer-events:none}::ng-deep .cds--side-nav__item--empty .menu-item-icon-container{display:none}::ng-deep .cds--side-nav__link[href*=\"javascript:return false;\"]{padding-right:3rem!important}.case-count{position:absolute;right:0;padding-right:1rem;height:100%;top:0;display:flex;align-items:center;justify-content:center;font-size:.875rem;letter-spacing:.1px;line-height:1.25rem;font-weight:500!important}::ng-deep .cds--side-nav__icon{margin-left:-16px}::ng-deep .cds--side-nav__item.cds--side-nav__item--icon a.cds--side-nav__link{padding-left:3.5rem}::ng-deep .cds--side-nav__submenu-title{padding-right:1.5rem}::ng-deep .cds--side-nav__items{display:flex!important;flex-direction:column!important;overflow:visible!important}::ng-deep .cds--side-nav__navigation{top:3rem;height:calc(100% - 3rem)!important;overflow-x:hidden!important;overflow-y:auto!important}::ng-deep .cds--side-nav__navigation:not(.cds--side-nav--expanded){width:0}.loading-container{display:flex;width:100%;justify-content:center}\n/*!\n * Copyright 2015-2025 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: i1$4.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: MenuItemTextComponent, selector: "valtimo-menu-item-text", inputs: ["menuItem", "accent", "showOverFlowMenu"], outputs: ["overflowMenuClosed", "openInNewTab"] }, { kind: "component", type: i2$3.SideNav, selector: "cds-sidenav, ibm-sidenav", inputs: ["ariaLabel", "expanded", "hidden", "rail", "allowExpansion", "navigationItems", "useRouter"] }, { kind: "component", type: i2$3.SideNavItem, selector: "cds-sidenav-item, ibm-sidenav-item", inputs: ["href", "useRouter", "active", "route", "isSubMenu", "routeExtras", "title"], outputs: ["navigation", "selected"] }, { kind: "component", type: i2$3.SideNavMenu, selector: "cds-sidenav-menu, ibm-sidenav-menu", inputs: ["useRouter", "title", "expanded", "hasActiveChild", "menuItems"] }, { kind: "directive", type: CtrlClickDirective, selector: "[ctrl-click]", outputs: ["ctrl-click"] }, { kind: "component", type: i2$3.Loading, selector: "cds-loading, ibm-loading", inputs: ["title", "isActive", "size", "overlay"] }, { kind: "pipe", type: i1$4.AsyncPipe, name: "async" }, { kind: "pipe", type: MenuItemTranslationPipe, name: "menuItemTranslate" }, { kind: "pipe", type: CaseCountPipe, name: "caseCount" }] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.25", ngImport: i0, type: LeftSidebarComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'valtimo-left-sidebar', standalone: false, template: "<!--\n  ~ Copyright 2015-2025 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-sidenav\n  *ngIf=\"{\n    closestSequence: closestSequence$ | async,\n    overflowMenuSequence: overflowMenuSequence$ | async,\n    sideBarExpanded: sideBarExpanded$ | async,\n    menuItemsLoaded: menuItemsLoaded$ | async,\n    menuItems: menuItems$ | async,\n  } as obs\"\n  [allowExpansion]=\"false\"\n  [expanded]=\"obs.sideBarExpanded\"\n>\n  <ng-container *ngIf=\"obs.menuItemsLoaded; else loadingTemplate\">\n    <ng-container *ngFor=\"let menuItem of obs.menuItems\">\n      <ng-container *ngIf=\"!menuItem.children\">\n        <ng-container\n          *ngTemplateOutlet=\"\n            topMenuItem;\n            context: {\n              menuItem: menuItem,\n              closestSequence: obs.closestSequence,\n              overflowMenuSequence: obs.overflowMenuSequence,\n            }\n          \"\n        ></ng-container>\n      </ng-container>\n\n      <ng-container *ngIf=\"menuItem.children\">\n        <ng-container\n          *ngTemplateOutlet=\"\n            topMenuItem;\n            context: {\n              closestSequence: obs.closestSequence,\n              menuItem: menuItem,\n              overflowMenuSequence: obs.overflowMenuSequence,\n            }\n          \"\n        ></ng-container>\n\n        <div [ngClass]=\"{\n          'menu-item--hidden': menuItem.includeFunction !== undefined,\n          'menu-item--visible':\n            menuItem.includeFunction !== undefined &&\n            (includeFunctionObservables[menuItem.title] | async),\n        }\">\n          <ng-container *ngTemplateOutlet=\"subMenuIcon; context: {menuItem: menuItem}\"></ng-container>\n\n          <cds-sidenav-menu\n            [title]=\"menuItem | menuItemTranslate | async\"\n            [attr.data-testid]=\"'sidenav-item-' + menuItem.title\"\n          >\n            <ng-container *ngFor=\"let childMenuItem of menuItem.children\">\n              <ng-container\n                *ngIf=\"{\n                  disableCaseCount: disableCaseCount$ | async,\n                  count: childMenuItem?.count$ && (childMenuItem?.count$ | async),\n                  sequence: '' + menuItem.sequence + '.' + childMenuItem.sequence,\n                } as vars\"\n              >\n                <cds-sidenav-item\n                  [attr.data-testid]=\"'sidenav-item-' + childMenuItem?.title\"\n                  [title]=\"\n                    menuItem.title === 'Cases' || menuItem.title === 'Dossiers'\n                      ? (childMenuItem | menuItemTranslate | async)\n                      : null\n                  \"\n                  [ngClass]=\"{\n                    'cds--side-nav__item--empty': !childMenuItem.link,\n                    'menu-item--hidden': childMenuItem.includeFunction !== undefined,\n                    'menu-item--visible':\n                      childMenuItem.includeFunction !== undefined &&\n                      (includeFunctionObservables[childMenuItem.title] | async),\n                  }\"\n                  [active]=\"vars.sequence === obs.closestSequence\"\n                  [href]=\"vars?.count ? 'javascript:return false;' : 'javascript:void(0);'\"\n                  (click)=\"navigateToRoute(childMenuItem.link, $event)\"\n                  (contextmenu)=\"onRightClick(vars.sequence)\"\n                  (ctrl-click)=\"openInNewTab(childMenuItem.link)\"\n                >\n                  <valtimo-menu-item-text\n                    [accent]=\"!childMenuItem.link\"\n                    [menuItem]=\"childMenuItem\"\n                    [showOverFlowMenu]=\"obs.overflowMenuSequence === vars.sequence\"\n                    (openInNewTab)=\"openInNewTab(childMenuItem.link)\"\n                    (overflowMenuClosed)=\"onOverflowMenuClosed(vars.sequence)\"\n                  ></valtimo-menu-item-text>\n\n                  <ng-container\n                    *ngTemplateOutlet=\"countTemplate; context: {count: vars.count, disableCaseCount: vars.disableCaseCount}\"\n                  ></ng-container>\n                </cds-sidenav-item>\n              </ng-container>\n            </ng-container>\n          </cds-sidenav-menu>\n        </div>\n      </ng-container>\n    </ng-container>\n  </ng-container>\n</cds-sidenav>\n\n<ng-template #subMenuIcon let-menuItem=\"menuItem\">\n  <div class=\"menu-item-icon-container\"><i class=\"{{ menuItem.iconClass }}\"></i></div>\n</ng-template>\n\n<ng-template\n  #topMenuItem\n  let-closestSequence=\"closestSequence\"\n  let-menuItem=\"menuItem\"\n  let-overflowMenuSequence=\"overflowMenuSequence\"\n>\n  <ng-container *ngIf=\"{sequence: '' + menuItem.sequence} as vars\"\n    ><cds-sidenav-item\n      *ngIf=\"!menuItem.children\"\n      [attr.data-testid]=\"'sidenav-item-' + menuItem.title\"\n      [ngClass]=\"{\n        'menu-item--hidden': menuItem.includeFunction !== undefined,\n        'menu-item--visible':\n          menuItem.includeFunction !== undefined &&\n          (includeFunctionObservables[menuItem.title] | async),\n      }\"\n      [active]=\"vars.sequence === closestSequence\"\n      (click)=\"navigateToRoute(menuItem.link, $event)\"\n      (contextmenu)=\"onRightClick(vars.sequence)\"\n      (ctrl-click)=\"openInNewTab(menuItem.link.link)\"\n      href=\"javascript:void(0)\"\n    >\n      <valtimo-menu-item-text\n        [menuItem]=\"menuItem\"\n        [showOverFlowMenu]=\"overflowMenuSequence === vars.sequence\"\n        (openInNewTab)=\"openInNewTab(menuItem.link.link)\"\n        (overflowMenuClosed)=\"onOverflowMenuClosed(vars.sequence)\"\n      ></valtimo-menu-item-text>\n    </cds-sidenav-item>\n  </ng-container>\n</ng-template>\n\n<ng-template #countTemplate let-count=\"count\" let-disableCaseCount=\"disableCaseCount\">\n  <ng-container *ngIf=\"count && !disableCaseCount\">\n    <span class=\"case-count\">\n      {{ count | caseCount }}\n    </span>\n  </ng-container>\n</ng-template>\n\n<ng-template #loadingTemplate>\n  <div class=\"loading-container\">\n    <cds-loading size=\"sm\"></cds-loading>\n  </div>\n</ng-template>\n", styles: ["@media screen and (max-width:767px){.be-left-sidebar{width:100%!important}}.be-left-sidebar .left-sidebar-toggle{padding:20px}.be-left-sidebar .left-sidebar-toggle:before{font-size:1.615rem}.be-left-sidebar .sidebar-elements>li>a.be-toggle-left-sidebar{height:32px;display:flex;align-items:center}.be-left-sidebar .left-sidebar-content{padding-top:20px}.be-toggle-left-sidebar svg{margin-right:7px;min-width:21px;height:auto;overflow:visible}.be-toggle-left-sidebar svg path{transition:.27s ease;fill:#696969}::ng-deep .resize-border{position:absolute;width:3px;height:100%;top:0;right:0;cursor:col-resize;background-color:var(--cds-border-strong);opacity:0;transition:opacity .11s cubic-bezier(.2,0,1,.9)}::ng-deep .resize-hover{opacity:1}::ng-deep .resize-border--invisible{display:none}.no-transition{transition:none}.d-1{d:path(\"M3 18v-2h13v2z\")}.d-1-flipped{d:path(\"M3 18v-2h11v2z\")}.d-2{d:path(\"M3 13v-2h10v2H3\")}.d-2-flipped{d:path(\"M3 13v-2h12v2H3\")}.d-3{d:path(\"M3 6h13v2H3V6\")}.d-3-flipped{d:path(\"M3 6h11v2H3V6\")}.d-4{d:path(\"M21 15.61L19.59 17l-5.01-5 5.01-5L21 8.39 17.44 12 21 15.61\")}.d-4-flipped{d:path(\"M15.58 15.61L16.99 17 22 12l-5.01-5-1.41 1.39L19.14 12l-3.56 3.61\")}::ng-deep .cds--side-nav__menu{padding-left:0}::ng-deep .cds--side-nav__navigation{border-right:1px solid #e0e0e0;height:100%}::ng-deep .cds--side-nav--ux{width:0}::ng-deep .cds--side-nav--expanded{width:16rem}::ng-deep .cds--side-nav__header-divider{display:none!important}.menu-item-icon-container{position:relative;top:8px;left:13px;height:0}.menu-item-icon-container i{width:0px;height:16px}.menu-item--hidden{display:none}.menu-item--visible{display:block}::ng-deep .cds--side-nav__item--empty{pointer-events:none}::ng-deep .cds--side-nav__item--empty .menu-item-icon-container{display:none}::ng-deep .cds--side-nav__link[href*=\"javascript:return false;\"]{padding-right:3rem!important}.case-count{position:absolute;right:0;padding-right:1rem;height:100%;top:0;display:flex;align-items:center;justify-content:center;font-size:.875rem;letter-spacing:.1px;line-height:1.25rem;font-weight:500!important}::ng-deep .cds--side-nav__icon{margin-left:-16px}::ng-deep .cds--side-nav__item.cds--side-nav__item--icon a.cds--side-nav__link{padding-left:3.5rem}::ng-deep .cds--side-nav__submenu-title{padding-right:1.5rem}::ng-deep .cds--side-nav__items{display:flex!important;flex-direction:column!important;overflow:visible!important}::ng-deep .cds--side-nav__navigation{top:3rem;height:calc(100% - 3rem)!important;overflow-x:hidden!important;overflow-y:auto!important}::ng-deep .cds--side-nav__navigation:not(.cds--side-nav--expanded){width:0}.loading-container{display:flex;width:100%;justify-content:center}\n/*!\n * Copyright 2015-2025 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"] }]
+            args: [{ selector: 'valtimo-left-sidebar', standalone: false, template: "<!--\n  ~ Copyright 2015-2025 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-sidenav\n  *ngIf=\"{\n    closestSequence: closestSequence$ | async,\n    overflowMenuSequence: overflowMenuSequence$ | async,\n    sideBarExpanded: sideBarExpanded$ | async,\n    menuItemsLoaded: menuItemsLoaded$ | async,\n    menuItems: menuItems$ | async,\n  } as obs\"\n  [allowExpansion]=\"false\"\n  [expanded]=\"obs.sideBarExpanded\"\n>\n  <ng-container *ngIf=\"obs.menuItemsLoaded; else loadingTemplate\">\n    <ng-container *ngFor=\"let menuItem of obs.menuItems; trackBy: trackByMenuItem\">\n      <ng-container *ngIf=\"!menuItem.children\">\n        <ng-container\n          *ngTemplateOutlet=\"\n            topMenuItem;\n            context: {\n              menuItem: menuItem,\n              closestSequence: obs.closestSequence,\n              overflowMenuSequence: obs.overflowMenuSequence,\n            }\n          \"\n        ></ng-container>\n      </ng-container>\n\n      <ng-container *ngIf=\"menuItem.children\">\n        <ng-container\n          *ngTemplateOutlet=\"\n            topMenuItem;\n            context: {\n              closestSequence: obs.closestSequence,\n              menuItem: menuItem,\n              overflowMenuSequence: obs.overflowMenuSequence,\n            }\n          \"\n        ></ng-container>\n\n        <div [ngClass]=\"{\n          'menu-item--hidden': menuItem.includeFunction !== undefined,\n          'menu-item--visible':\n            menuItem.includeFunction !== undefined &&\n            (includeFunctionObservables[menuItem.title] | async),\n        }\">\n          <ng-container *ngTemplateOutlet=\"subMenuIcon; context: {menuItem: menuItem}\"></ng-container>\n\n          <cds-sidenav-menu\n            [title]=\"menuItem | menuItemTranslate | async\"\n            [attr.data-testid]=\"'sidenav-item-' + menuItem.title\"\n          >\n            <ng-container\n              *ngFor=\"let childMenuItem of menuItem.children; trackBy: trackByMenuItem\"\n            >\n              <ng-container\n                *ngIf=\"{\n                  disableCaseCount: disableCaseCount$ | async,\n                  count: childMenuItem?.count$ && (childMenuItem?.count$ | async),\n                  sequence: '' + menuItem.sequence + '.' + childMenuItem.sequence,\n                } as vars\"\n              >\n                <cds-sidenav-item\n                  [attr.data-testid]=\"'sidenav-item-' + childMenuItem?.title\"\n                  [title]=\"\n                    menuItem.title === 'Cases' || menuItem.title === 'Dossiers'\n                      ? (childMenuItem | menuItemTranslate | async)\n                      : null\n                  \"\n                  [ngClass]=\"{\n                    'cds--side-nav__item--empty': !childMenuItem.link,\n                    'menu-item--hidden': childMenuItem.includeFunction !== undefined,\n                    'menu-item--visible':\n                      childMenuItem.includeFunction !== undefined &&\n                      (includeFunctionObservables[childMenuItem.title] | async),\n                  }\"\n                  [active]=\"vars.sequence === obs.closestSequence\"\n                  [href]=\"vars?.count ? 'javascript:return false;' : 'javascript:void(0);'\"\n                  (click)=\"navigateToRoute(childMenuItem.link, $event)\"\n                  (contextmenu)=\"onRightClick(vars.sequence)\"\n                  (ctrl-click)=\"openInNewTab(childMenuItem.link)\"\n                >\n                  <valtimo-menu-item-text\n                    [accent]=\"!childMenuItem.link\"\n                    [menuItem]=\"childMenuItem\"\n                    [showOverFlowMenu]=\"obs.overflowMenuSequence === vars.sequence\"\n                    (openInNewTab)=\"openInNewTab(childMenuItem.link)\"\n                    (overflowMenuClosed)=\"onOverflowMenuClosed(vars.sequence)\"\n                  ></valtimo-menu-item-text>\n\n                  <ng-container\n                    *ngTemplateOutlet=\"countTemplate; context: {count: vars.count, disableCaseCount: vars.disableCaseCount}\"\n                  ></ng-container>\n                </cds-sidenav-item>\n              </ng-container>\n            </ng-container>\n          </cds-sidenav-menu>\n        </div>\n      </ng-container>\n    </ng-container>\n  </ng-container>\n</cds-sidenav>\n\n<ng-template #subMenuIcon let-menuItem=\"menuItem\">\n  <div class=\"menu-item-icon-container\"><i class=\"{{ menuItem.iconClass }}\"></i></div>\n</ng-template>\n\n<ng-template\n  #topMenuItem\n  let-closestSequence=\"closestSequence\"\n  let-menuItem=\"menuItem\"\n  let-overflowMenuSequence=\"overflowMenuSequence\"\n>\n  <ng-container *ngIf=\"{sequence: '' + menuItem.sequence} as vars\"\n    ><cds-sidenav-item\n      *ngIf=\"!menuItem.children\"\n      [attr.data-testid]=\"'sidenav-item-' + menuItem.title\"\n      [ngClass]=\"{\n        'menu-item--hidden': menuItem.includeFunction !== undefined,\n        'menu-item--visible':\n          menuItem.includeFunction !== undefined &&\n          (includeFunctionObservables[menuItem.title] | async),\n      }\"\n      [active]=\"vars.sequence === closestSequence\"\n      (click)=\"navigateToRoute(menuItem.link, $event)\"\n      (contextmenu)=\"onRightClick(vars.sequence)\"\n      (ctrl-click)=\"openInNewTab(menuItem.link.link)\"\n      href=\"javascript:void(0)\"\n    >\n      <valtimo-menu-item-text\n        [menuItem]=\"menuItem\"\n        [showOverFlowMenu]=\"overflowMenuSequence === vars.sequence\"\n        (openInNewTab)=\"openInNewTab(menuItem.link.link)\"\n        (overflowMenuClosed)=\"onOverflowMenuClosed(vars.sequence)\"\n      ></valtimo-menu-item-text>\n    </cds-sidenav-item>\n  </ng-container>\n</ng-template>\n\n<ng-template #countTemplate let-count=\"count\" let-disableCaseCount=\"disableCaseCount\">\n  <ng-container *ngIf=\"count && !disableCaseCount\">\n    <span class=\"case-count\">\n      {{ count | caseCount }}\n    </span>\n  </ng-container>\n</ng-template>\n\n<ng-template #loadingTemplate>\n  <div class=\"loading-container\">\n    <cds-loading size=\"sm\"></cds-loading>\n  </div>\n</ng-template>\n", styles: ["@media screen and (max-width:767px){.be-left-sidebar{width:100%!important}}.be-left-sidebar .left-sidebar-toggle{padding:20px}.be-left-sidebar .left-sidebar-toggle:before{font-size:1.615rem}.be-left-sidebar .sidebar-elements>li>a.be-toggle-left-sidebar{height:32px;display:flex;align-items:center}.be-left-sidebar .left-sidebar-content{padding-top:20px}.be-toggle-left-sidebar svg{margin-right:7px;min-width:21px;height:auto;overflow:visible}.be-toggle-left-sidebar svg path{transition:.27s ease;fill:#696969}::ng-deep .resize-border{position:absolute;width:3px;height:100%;top:0;right:0;cursor:col-resize;background-color:var(--cds-border-strong);opacity:0;transition:opacity .11s cubic-bezier(.2,0,1,.9)}::ng-deep .resize-hover{opacity:1}::ng-deep .resize-border--invisible{display:none}.no-transition{transition:none}.d-1{d:path(\"M3 18v-2h13v2z\")}.d-1-flipped{d:path(\"M3 18v-2h11v2z\")}.d-2{d:path(\"M3 13v-2h10v2H3\")}.d-2-flipped{d:path(\"M3 13v-2h12v2H3\")}.d-3{d:path(\"M3 6h13v2H3V6\")}.d-3-flipped{d:path(\"M3 6h11v2H3V6\")}.d-4{d:path(\"M21 15.61L19.59 17l-5.01-5 5.01-5L21 8.39 17.44 12 21 15.61\")}.d-4-flipped{d:path(\"M15.58 15.61L16.99 17 22 12l-5.01-5-1.41 1.39L19.14 12l-3.56 3.61\")}::ng-deep .cds--side-nav__menu{padding-left:0}::ng-deep .cds--side-nav__navigation{border-right:1px solid #e0e0e0;height:100%}::ng-deep .cds--side-nav--ux{width:0}::ng-deep .cds--side-nav--expanded{width:16rem}::ng-deep .cds--side-nav__header-divider{display:none!important}.menu-item-icon-container{position:relative;top:8px;left:13px;height:0}.menu-item-icon-container i{width:0px;height:16px}.menu-item--hidden{display:none}.menu-item--visible{display:block}::ng-deep .cds--side-nav__item--empty{pointer-events:none}::ng-deep .cds--side-nav__item--empty .menu-item-icon-container{display:none}::ng-deep .cds--side-nav__link[href*=\"javascript:return false;\"]{padding-right:3rem!important}.case-count{position:absolute;right:0;padding-right:1rem;height:100%;top:0;display:flex;align-items:center;justify-content:center;font-size:.875rem;letter-spacing:.1px;line-height:1.25rem;font-weight:500!important}::ng-deep .cds--side-nav__icon{margin-left:-16px}::ng-deep .cds--side-nav__item.cds--side-nav__item--icon a.cds--side-nav__link{padding-left:3.5rem}::ng-deep .cds--side-nav__submenu-title{padding-right:1.5rem}::ng-deep .cds--side-nav__items{display:flex!important;flex-direction:column!important;overflow:visible!important}::ng-deep .cds--side-nav__navigation{top:3rem;height:calc(100% - 3rem)!important;overflow-x:hidden!important;overflow-y:auto!important}::ng-deep .cds--side-nav__navigation:not(.cds--side-nav--expanded){width:0}.loading-container{display:flex;width:100%;justify-content:center}\n/*!\n * Copyright 2015-2025 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"] }]
         }], ctorParameters: () => [{ type: i0.ElementRef }, { type: MenuService }, { type: ShellService }, { type: i3.BreakpointObserver }, { type: i1$3.Router }, { type: i1$2.ConfigService }], propDecorators: { toggleButtonRef: [{
                 type: ViewChild,
                 args: ['toggleButton']
@@ -6325,7 +6341,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.
@@ -6339,36 +6355,103 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.25", ngImpo
  * See the License for the specific language governing permissions and
  * limitations under the License.
  */
+const OPEN_ATTRIBUTE_NAME = 'ng-reflect-open';
 class ValtimoCdsModalDirective {
     constructor(document, elementRef, renderer) {
         this.document = document;
         this.elementRef = elementRef;
         this.renderer = renderer;
+        // Not `readonly`: Angular assigns inputs, and template type checking reports every binding to
+        // a read-only property as TS2540 "Cannot assign to ... because it is a read-only property".
         this.minContentHeight = 0;
+        // Content elements that already received the min-height style. The MutationObserver below
+        // observes attribute changes in the same subtree that setStyle writes to, so styling must be
+        // skipped for elements that were already styled — re-applying the style queues a new mutation
+        // record, whose callback re-applies the style again, locking the page in an endless
+        // MutationObserver microtask loop (the browser tab freezes).
+        this._styledContentElements = new WeakSet();
+        /**
+         * 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) => {
             this.handleMutations(mutations);
         });
+        // Only the open/close attribute is of interest. Observing *every* attribute would include the
+        // min-height this directive writes on the modal content below: that write mutates the observed
+        // subtree, so it would schedule another callback, which writes again — a microtask loop that
+        // starves the main thread and freezes the page. (It stayed dormant while the value was a plain
+        // `<n>px`, which the CSSOM stores verbatim, so re-writing it was a no-op that recorded no
+        // mutation. A value the browser re-serializes, such as `min(...)`, never compares equal to what
+        // was set, so every write does record one.)
         this._mutationObserver.observe(this.elementRef.nativeElement, {
             attributes: true,
+            attributeFilter: [OPEN_ATTRIBUTE_NAME],
             childList: true,
             subtree: true,
-            characterData: true,
         });
-        const open = this.elementRef.nativeElement.getAttribute('ng-reflect-open');
+        const open = this.elementRef.nativeElement.getAttribute(OPEN_ATTRIBUTE_NAME);
         if (open === 'true') {
             this.applyDocumentOverflowHidden();
         }
         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';
         for (const mutation of mutations) {
             if (mutation.type === 'attributes' && mutation.attributeName === OPEN_ATTRIBUTE_NAME) {
                 const open = this.elementRef.nativeElement.getAttribute(OPEN_ATTRIBUTE_NAME);
@@ -6396,6 +6479,10 @@ class ValtimoCdsModalDirective {
             return;
         const contentElements = this.elementRef.nativeElement.querySelectorAll('.cds--modal-content');
         for (const element of contentElements) {
+            if (this._styledContentElements.has(element)) {
+                continue;
+            }
+            this._styledContentElements.add(element);
             this.renderer.setStyle(element, 'min-height', `min(${this.minContentHeight}px, calc(90dvh - 13rem))`, RendererStyleFlags2.Important);
         }
     }
@@ -6694,59 +6781,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 +6898,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,11 +7396,11 @@ 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    [portalToBody]=\"true\"\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,
-            args: [{ selector: 'valtimo-carbon-list', changeDetection: ChangeDetectionStrategy.OnPush, providers: [CarbonListFilterPipe, CarbonListDragAndDropService], standalone: false, 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"] }]
+            args: [{ selector: 'valtimo-carbon-list', changeDetection: ChangeDetectionStrategy.OnPush, providers: [CarbonListFilterPipe, CarbonListDragAndDropService], standalone: false, 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    [portalToBody]=\"true\"\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"] }]
         }], ctorParameters: () => [{ type: EllipsisPipe }, { type: CarbonListFilterPipe }, { type: i2$3.IconService }, { type: i4.NGXLogger }, { type: i1.TranslateService }, { type: ViewContentService }, { type: KeyStateService }, { type: CarbonListDragAndDropService }, { type: i0.ElementRef }, { type: i0.ChangeDetectorRef }], propDecorators: { actionsMenuTemplate: [{
                 type: ViewChild,
                 args: ['actionsMenuTemplate']
@@ -7360,6 +7490,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.25", ngImpo
                 type: Input
             }], expandedRowKey: [{
                 type: Input
+            }], trackByKey: [{
+                type: Input
             }], rowClicked: [{
                 type: Output
             }], paginationClicked: [{
@@ -9443,7 +9575,14 @@ class FormioComponent {
             };
             return deepmerge(defaultOptions, overrideOptions);
         }), distinctUntilChanged((prev, curr) => isEqual(prev, curr)), tap$1(options => this.logger.debug('Form.IO options used', options)));
-        this.tokenSetInLocalStorage$ = this.localStorageService.tokenSetInLocalStorage$;
+        this._storeTokenInLocalStorage = !this.configService.getFeatureToggle('disableFormioTokenInLocalStorage');
+        this._inMemoryTokenSet$ = new BehaviorSubject(false);
+        // The form is only rendered once a token is available. In the default (legacy) mode the token
+        // is persisted to localStorage, so we wait for that; when disableFormioTokenInLocalStorage is
+        // enabled the token is kept in memory only, so we wait for the in-memory token instead.
+        this.tokenReady$ = this._storeTokenInLocalStorage
+            ? this.localStorageService.tokenSetInLocalStorage$
+            : this._inMemoryTokenSet$.asObservable();
         this._subscriptions = new Subscription();
         this._tokenTimerSubscription = new Subscription();
         this.setOverrideOptions(this.configService.config);
@@ -9517,10 +9656,19 @@ class FormioComponent {
         });
     }
     setToken(token) {
-        Formio.setUser(jwtDecode(token));
-        Formio.setToken(token);
+        if (this._storeTokenInLocalStorage) {
+            Formio.setUser(jwtDecode(token));
+            Formio.setToken(token);
+            this.localStorageService.setTokenInLocalStorage(token);
+        }
+        else {
+            // Feature toggle 'disableFormioTokenInLocalStorage': keep the token in memory only, since
+            // Formio.setToken/setUser would persist it (and the decoded user) to localStorage where any
+            // script could read it. Our APIs authenticate via the Keycloak token on the HTTP interceptor.
+            Formio.token = token;
+            this._inMemoryTokenSet$.next(true);
+        }
         this.setTimerForTokenRefresh(token);
-        this.localStorageService.setTokenInLocalStorage(token);
         this.logger.debug('New token set for form.io.');
     }
     setTimerForTokenRefresh(token) {
@@ -9565,11 +9713,11 @@ class FormioComponent {
         this._overrideOptions$.next(config.formioOptions);
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.25", ngImport: i0, type: FormioComponent, deps: [{ token: i6$1.UserProviderService }, { token: i4.NGXLogger }, { token: FormIoStateService }, { token: i1$3.ActivatedRoute }, { token: i1.TranslateService }, { token: FormIoLocalStorageService }, { token: ValtimoModalService }, { token: i1$2.ConfigService }, { token: FormIoTagsService }, { token: i0.Injector }, { token: FormioTranslationService }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.25", type: FormioComponent, isStandalone: false, selector: "valtimo-form-io", inputs: { options: "options", submission: "submission", form: "form", readOnly: "readOnly", errors: "errors", formRefresh$: "formRefresh$" }, outputs: { submit: "submit", change: "change", event: "event" }, host: { listeners: { "window:beforeunload": "handleBeforeUnload($event)" } }, providers: [FormIoLocalStorageService], usesOnChanges: true, ngImport: i0, template: "<!--\n  ~ Copyright 2015-2025 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<div\n  class=\"formio-carbon\"\n  cdsLayer=\"1\"\n  *ngIf=\"{\n    currentLanguage: currentLanguage$ | async,\n    formioOptions: formioOptions$ | async,\n    submission: submission$ | async,\n    readOnly: readOnly$ | async,\n    form: form$ | async,\n    errors: errors$ | async,\n    tokenSetInLocalStorage: tokenSetInLocalStorage$ | async,\n  } as obs\"\n>\n  <div *ngIf=\"obs.errors.length > 0\" class=\"alert alert-danger pt-5 pb-5 mb-2\">\n    <ol>\n      <li *ngFor=\"let error of obs.errors\">\n        {{ error }}\n      </li>\n    </ol>\n  </div>\n\n  <formio\n    *ngIf=\"obs.formioOptions && obs.form && obs.tokenSetInLocalStorage\"\n    [form]=\"obs.form\"\n    [language]=\"languageEventEmitter\"\n    [options]=\"obs.formioOptions\"\n    [readOnly]=\"obs.readOnly\"\n    [refresh]=\"refreshForm\"\n    [submission]=\"obs.submission\"\n    (change)=\"onChange($event)\"\n    (nextPage)=\"nextPage()\"\n    (prevPage)=\"prevPage()\"\n    (ready)=\"formReady($event)\"\n    (submit)=\"onSubmit($event)\"\n    (customEvent)=\"onCustomEvent($event)\"\n  ></formio>\n</div>\n", styles: [""], dependencies: [{ 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: "component", type: i9.FormioComponent, selector: "formio" }, { kind: "directive", type: i2$3.LayerDirective, selector: "[cdsLayer], [ibmLayer]", inputs: ["ibmLayer", "cdsLayer"], exportAs: ["layer"] }, { kind: "pipe", type: i1$4.AsyncPipe, name: "async" }] }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.25", type: FormioComponent, isStandalone: false, selector: "valtimo-form-io", inputs: { options: "options", submission: "submission", form: "form", readOnly: "readOnly", errors: "errors", formRefresh$: "formRefresh$" }, outputs: { submit: "submit", change: "change", event: "event" }, host: { listeners: { "window:beforeunload": "handleBeforeUnload($event)" } }, providers: [FormIoLocalStorageService], usesOnChanges: true, ngImport: i0, template: "<!--\n  ~ Copyright 2015-2025 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<div\n  class=\"formio-carbon\"\n  cdsLayer=\"1\"\n  *ngIf=\"{\n    currentLanguage: currentLanguage$ | async,\n    formioOptions: formioOptions$ | async,\n    submission: submission$ | async,\n    readOnly: readOnly$ | async,\n    form: form$ | async,\n    errors: errors$ | async,\n    tokenReady: tokenReady$ | async,\n  } as obs\"\n>\n  <div *ngIf=\"obs.errors.length > 0\" class=\"alert alert-danger pt-5 pb-5 mb-2\">\n    <ol>\n      <li *ngFor=\"let error of obs.errors\">\n        {{ error }}\n      </li>\n    </ol>\n  </div>\n\n  <formio\n    *ngIf=\"obs.formioOptions && obs.form && obs.tokenReady\"\n    [form]=\"obs.form\"\n    [language]=\"languageEventEmitter\"\n    [options]=\"obs.formioOptions\"\n    [readOnly]=\"obs.readOnly\"\n    [refresh]=\"refreshForm\"\n    [submission]=\"obs.submission\"\n    (change)=\"onChange($event)\"\n    (nextPage)=\"nextPage()\"\n    (prevPage)=\"prevPage()\"\n    (ready)=\"formReady($event)\"\n    (submit)=\"onSubmit($event)\"\n    (customEvent)=\"onCustomEvent($event)\"\n  ></formio>\n</div>\n", styles: [""], dependencies: [{ 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: "component", type: i9.FormioComponent, selector: "formio" }, { kind: "directive", type: i2$3.LayerDirective, selector: "[cdsLayer], [ibmLayer]", inputs: ["ibmLayer", "cdsLayer"], exportAs: ["layer"] }, { kind: "pipe", type: i1$4.AsyncPipe, name: "async" }] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.25", ngImport: i0, type: FormioComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'valtimo-form-io', providers: [FormIoLocalStorageService], standalone: false, template: "<!--\n  ~ Copyright 2015-2025 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<div\n  class=\"formio-carbon\"\n  cdsLayer=\"1\"\n  *ngIf=\"{\n    currentLanguage: currentLanguage$ | async,\n    formioOptions: formioOptions$ | async,\n    submission: submission$ | async,\n    readOnly: readOnly$ | async,\n    form: form$ | async,\n    errors: errors$ | async,\n    tokenSetInLocalStorage: tokenSetInLocalStorage$ | async,\n  } as obs\"\n>\n  <div *ngIf=\"obs.errors.length > 0\" class=\"alert alert-danger pt-5 pb-5 mb-2\">\n    <ol>\n      <li *ngFor=\"let error of obs.errors\">\n        {{ error }}\n      </li>\n    </ol>\n  </div>\n\n  <formio\n    *ngIf=\"obs.formioOptions && obs.form && obs.tokenSetInLocalStorage\"\n    [form]=\"obs.form\"\n    [language]=\"languageEventEmitter\"\n    [options]=\"obs.formioOptions\"\n    [readOnly]=\"obs.readOnly\"\n    [refresh]=\"refreshForm\"\n    [submission]=\"obs.submission\"\n    (change)=\"onChange($event)\"\n    (nextPage)=\"nextPage()\"\n    (prevPage)=\"prevPage()\"\n    (ready)=\"formReady($event)\"\n    (submit)=\"onSubmit($event)\"\n    (customEvent)=\"onCustomEvent($event)\"\n  ></formio>\n</div>\n" }]
+            args: [{ selector: 'valtimo-form-io', providers: [FormIoLocalStorageService], standalone: false, template: "<!--\n  ~ Copyright 2015-2025 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<div\n  class=\"formio-carbon\"\n  cdsLayer=\"1\"\n  *ngIf=\"{\n    currentLanguage: currentLanguage$ | async,\n    formioOptions: formioOptions$ | async,\n    submission: submission$ | async,\n    readOnly: readOnly$ | async,\n    form: form$ | async,\n    errors: errors$ | async,\n    tokenReady: tokenReady$ | async,\n  } as obs\"\n>\n  <div *ngIf=\"obs.errors.length > 0\" class=\"alert alert-danger pt-5 pb-5 mb-2\">\n    <ol>\n      <li *ngFor=\"let error of obs.errors\">\n        {{ error }}\n      </li>\n    </ol>\n  </div>\n\n  <formio\n    *ngIf=\"obs.formioOptions && obs.form && obs.tokenReady\"\n    [form]=\"obs.form\"\n    [language]=\"languageEventEmitter\"\n    [options]=\"obs.formioOptions\"\n    [readOnly]=\"obs.readOnly\"\n    [refresh]=\"refreshForm\"\n    [submission]=\"obs.submission\"\n    (change)=\"onChange($event)\"\n    (nextPage)=\"nextPage()\"\n    (prevPage)=\"prevPage()\"\n    (ready)=\"formReady($event)\"\n    (submit)=\"onSubmit($event)\"\n    (customEvent)=\"onCustomEvent($event)\"\n  ></formio>\n</div>\n" }]
         }], ctorParameters: () => [{ type: i6$1.UserProviderService }, { type: i4.NGXLogger }, { type: FormIoStateService }, { type: i1$3.ActivatedRoute }, { type: i1.TranslateService }, { type: FormIoLocalStorageService }, { type: ValtimoModalService }, { type: i1$2.ConfigService }, { type: FormIoTagsService }, { type: i0.Injector }, { type: FormioTranslationService }], propDecorators: { options: [{
                 type: Input
             }], submission: [{
@@ -10454,7 +10602,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 +10651,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 +13872,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,