@valtimo/components 13.27.0 → 13.28.1

package/fesm2022/valtimo-components.mjs

@@ -1,13 +1,13 @@
 import * as i0 from '@angular/core';
 import { InjectionToken, Pipe, NgModule, Injectable, RendererStyleFlags2, Inject, signal, computed, Input, Component, Directive, EventEmitter, Output, ViewContainerRef, ViewChild, HostBinding, HostListener, ChangeDetectionStrategy, ContentChildren, ViewEncapsulation, inject, TemplateRef, ContentChild, ElementRef, forwardRef } from '@angular/core';
-import { combineLatest, map, BehaviorSubject, Subscription, Observable, filter as filter$1, fromEvent, Subject, take as take$1, of, tap as tap$1, interval, switchMap, takeUntil, merge, startWith, debounceTime as debounceTime$1, timer, first } from 'rxjs';
+import { combineLatest, map, BehaviorSubject, switchMap, catchError, of, shareReplay, tap, Subscription, Observable, filter as filter$1, fromEvent, Subject, take as take$1, interval, takeUntil, merge, startWith, debounceTime as debounceTime$1, timer, first } from 'rxjs';
 import * as i1 from '@ngx-translate/core';
 import { TranslateModule, TranslateLoader, TranslateService, TranslatePipe } from '@ngx-translate/core';
-import { filter, map as map$1, take, tap, debounceTime, distinctUntilChanged, takeUntil as takeUntil$1, startWith as startWith$1, switchMap as switchMap$1, delay } from 'rxjs/operators';
-import * as i1$1 from '@angular/common/http';
-import { HttpClient } from '@angular/common/http';
 import * as i1$2 from '@valtimo/shared';
 import { BaseApiService, VERSIONS, HttpLoaderFactory, getContextObservable, getCaseManagementRouteParams, getBuildingBlockManagementRouteParams } from '@valtimo/shared';
+import * as i1$1 from '@angular/common/http';
+import { HttpClient } from '@angular/common/http';
+import { filter, map as map$1, take, tap as tap$1, debounceTime, distinctUntilChanged, takeUntil as takeUntil$1, startWith as startWith$1, switchMap as switchMap$1, delay } from 'rxjs/operators';
 import * as i1$4 from '@angular/common';
 import { DOCUMENT, CommonModule, registerLocaleData, CurrencyPipe, DecimalPipe, PercentPipe } from '@angular/common';
 import * as i1$3 from '@angular/router';
@@ -22,14 +22,14 @@ import * as i2 from '@angular/forms';
 import { Validators, UntypedFormControl, ReactiveFormsModule, FormsModule, FormControl, FormGroup, NG_VALUE_ACCESSOR, NG_VALIDATORS } from '@angular/forms';
 import moment from 'moment';
 import User20 from '@carbon/icons/es/user/20';
-import * as i1$5 from 'keycloak-angular';
-import * as i2$2 from 'carbon-components-angular';
+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 * as i5 from '@angular/platform-browser';
+import * as i6 from '@angular/platform-browser';
 import * as i2$1 from 'ngx-skeleton-loader';
 import { NgxSkeletonLoaderModule } from 'ngx-skeleton-loader';
 import * as i4 from 'ngx-logger';
-import * as i6 from '@valtimo/security';
+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';
@@ -40,7 +40,7 @@ import localeNl from '@angular/common/locales/nl';
 import moment$1 from 'moment/moment';
 import NavigatedViewer from 'bpmn-js/lib/NavigatedViewer';
 import heatmap from 'heatmap.js-fixed/build/heatmap.js';
-import * as i1$6 from '@valtimo/resource';
+import * as i1$5 from '@valtimo/resource';
 import { S3Resource, ResourceModule, UploadProviderService } from '@valtimo/resource';
 import { jwtDecode } from 'jwt-decode';
 import Dropzone from 'dropzone';
@@ -48,12 +48,12 @@ import * as i3$1 from '@valtimo/document';
 import { DocumentModule, InternalCaseStatusUtils, CaseTagsUtils } from '@valtimo/document';
 import { ComponentPortal, TemplatePortal } from '@angular/cdk/portal';
 import { trigger, transition, style, animate } from '@angular/animations';
-import * as i1$7 from '@angular/cdk/overlay';
+import * as i1$6 from '@angular/cdk/overlay';
 import { OverlayModule, Overlay } from '@angular/cdk/overlay';
 import Currency from '@tadashi/currency';
-import * as i2$3 from 'ngx-spinner';
+import * as i2$4 from 'ngx-spinner';
 import { NgxSpinnerModule } from 'ngx-spinner';
-import * as i2$4 from 'ng-multiselect-dropdown';
+import * as i2$5 from 'ng-multiselect-dropdown';
 import { NgMultiSelectDropDownModule } from 'ng-multiselect-dropdown';
 import { v4 } from 'uuid';
 import flatpickr from 'flatpickr';
@@ -63,6 +63,7 @@ import { english } from 'flatpickr/dist/l10n/default';
 import { createJSONEditor } from 'vanilla-jsoneditor';
 import Ajv from 'ajv';
 import Muuri from 'muuri';
+import Pickr from '@simonwep/pickr';
 
 /*
  * Copyright 2015-2025 Ritense BV, the Netherlands.
@@ -711,6 +712,38 @@ var ValuePathSelectorInputMode;
  * limitations under the License.
  */
 
+/*
+ * 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.
+ * You may obtain a copy of the License at
+ *
+ * https://joinup.ec.europa.eu/collection/eupl/eupl-text-eupl-12
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" basis,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+/*
+ * 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.
+ * You may obtain a copy of the License at
+ *
+ * https://joinup.ec.europa.eu/collection/eupl/eupl-text-eupl-12
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" basis,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
 /*
  * Copyright 2015-2025 Ritense BV, the Netherlands.
  *
@@ -1065,6 +1098,11 @@ const RIGHT_SIDEBAR_TEST_IDS = {
     languageDropdown: 'rightSidebarLanguageDropdown',
     themeDropdown: 'rightSidebarThemeDropdown',
 };
+const COLOR_PICKER_TEST_IDS = {
+    label: 'colorPickerLabel',
+    container: 'colorPickerContainer',
+    trigger: 'colorPickerTrigger',
+};
 
 /*
  * Copyright 2015-2025 Ritense BV, the Netherlands.
@@ -1258,6 +1296,96 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.20", ngImpo
  * limitations under the License.
  */
 
+/*
+ * 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.
+ * You may obtain a copy of the License at
+ *
+ * https://joinup.ec.europa.eu/collection/eupl/eupl-text-eupl-12
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" basis,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+class AdminSettingsService extends BaseApiService {
+    constructor(httpClient, configService) {
+        super(httpClient, configService);
+        this.httpClient = httpClient;
+        this.configService = configService;
+        this._refreshLogos$ = new BehaviorSubject(null);
+        this._refreshToggles$ = new BehaviorSubject(null);
+        this._refreshAccentColors$ = new BehaviorSubject(null);
+        this._accentColorDefaults = {};
+        this._logos$ = this._refreshLogos$.pipe(switchMap(() => this.httpClient
+            .get(this.getApiUrl('/v1/admin-settings/logos'))
+            .pipe(catchError(() => of(null)))), shareReplay(1));
+        this._featureToggleOverrides$ = this._refreshToggles$.pipe(switchMap(() => this.httpClient
+            .get(this.getApiUrl('/v1/admin-settings/feature-toggles'))
+            .pipe(map(response => response.overrides), catchError(() => of({})))), tap(overrides => this.configService.patchFeatureToggles(overrides)), shareReplay(1));
+        this._accentColors$ = this._refreshAccentColors$.pipe(switchMap(() => this.httpClient
+            .get(this.getApiUrl('/v1/admin-settings/accent-colors'))
+            .pipe(map(response => response.colors), catchError(() => of({})))), tap(colors => this.applyAccentColors(colors)), shareReplay(1));
+    }
+    getLogos() {
+        return this._logos$;
+    }
+    refreshLogos() {
+        this._refreshLogos$.next(null);
+    }
+    getFeatureToggleOverrides() {
+        return this._featureToggleOverrides$;
+    }
+    getMergedFeatureToggles() {
+        const envToggles = this.configService.config.featureToggles ?? {};
+        return this._featureToggleOverrides$.pipe(map(overrides => ({ ...envToggles, ...overrides })));
+    }
+    refreshFeatureToggles() {
+        this._refreshToggles$.next(null);
+    }
+    getAccentColors() {
+        return this._accentColors$;
+    }
+    refreshAccentColors() {
+        this._refreshAccentColors$.next(null);
+    }
+    applyAccentColors(colors) {
+        const root = document.documentElement;
+        Object.entries(colors).forEach(([cssVar, value]) => {
+            if (cssVar && value) {
+                // Snapshot the stylesheet default before the first inline override is written,
+                // so consumers can later distinguish the FE default from the currently applied value.
+                if (!(cssVar in this._accentColorDefaults)) {
+                    this._accentColorDefaults[cssVar] = getComputedStyle(root)
+                        .getPropertyValue(cssVar)
+                        .trim();
+                }
+                root.style.setProperty(cssVar, value);
+            }
+        });
+    }
+    getComputedAccentColor(cssVar) {
+        return getComputedStyle(document.documentElement).getPropertyValue(cssVar).trim();
+    }
+    getDefaultAccentColor(cssVar) {
+        if (cssVar in this._accentColorDefaults) {
+            return this._accentColorDefaults[cssVar];
+        }
+        return this.getComputedAccentColor(cssVar);
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.20", ngImport: i0, type: AdminSettingsService, deps: [{ token: i1$1.HttpClient }, { token: i1$2.ConfigService }], target: i0.ɵɵFactoryTarget.Injectable }); }
+    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "19.2.20", ngImport: i0, type: AdminSettingsService, providedIn: 'root' }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.20", ngImport: i0, type: AdminSettingsService, decorators: [{
+            type: Injectable,
+            args: [{
+                    providedIn: 'root',
+                }]
+        }], ctorParameters: () => [{ type: i1$1.HttpClient }, { type: i1$2.ConfigService }] });
+
 /*
  * Copyright 2015-2026 Ritense BV, the Netherlands.
  *
@@ -1557,7 +1685,7 @@ class ModalService {
         }
     }
     getModalVisible(modalUuid) {
-        return combineLatest([this._modalVisible$, this._modalUuid$]).pipe(map$1(([currentModalVisible, currentModalUuid]) => currentModalVisible && currentModalUuid === modalUuid), tap(visible => {
+        return combineLatest([this._modalVisible$, this._modalUuid$]).pipe(map$1(([currentModalVisible, currentModalUuid]) => currentModalVisible && currentModalUuid === modalUuid), tap$1(visible => {
             if (visible) {
                 this._appearing$.next(true);
                 this.setAppearingTimeout();
@@ -1654,11 +1782,22 @@ class PageHeaderService {
         this.configService = configService;
         this._headerViewContainerRef$ = new BehaviorSubject(null);
         this._contentViewContainerRef$ = new BehaviorSubject(null);
-        this._compactMode$ = new BehaviorSubject(!!this.configService?.config?.featureToggles?.compactModeOnByDefault);
-        this._showUserNameInTopBar$ = new BehaviorSubject(this.getDefaultShowUserNameInTopBarValue());
+        this._compactMode$ = new BehaviorSubject(false);
+        this._showUserNameInTopBar$ = new BehaviorSubject(true);
         this._pageActionsHasContent$ = new BehaviorSubject(false);
         this._pageHeadHeight$ = new BehaviorSubject(null);
         this._smallTitle$ = new BehaviorSubject(false);
+        this._featureToggleSub = this.configService.featureToggles$.subscribe(toggles => {
+            if (toggles?.hasOwnProperty('compactModeOnByDefault')) {
+                this._compactMode$.next(!!toggles.compactModeOnByDefault);
+            }
+            if (toggles?.hasOwnProperty('showUserNameInTopBar')) {
+                this._showUserNameInTopBar$.next(!!toggles.showUserNameInTopBar);
+            }
+            else {
+                this._showUserNameInTopBar$.next(true);
+            }
+        });
     }
     setHeaderViewContainerRef(ref) {
         this._headerViewContainerRef$.next(ref);
@@ -1684,13 +1823,6 @@ class PageHeaderService {
     disableSmallTitle() {
         this._smallTitle$.next(false);
     }
-    getDefaultShowUserNameInTopBarValue() {
-        const featureToggles = this.configService?.config?.featureToggles;
-        if (featureToggles && featureToggles.hasOwnProperty('showUserNameInTopBar')) {
-            return featureToggles.showUserNameInTopBar;
-        }
-        return true;
-    }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.20", ngImport: i0, type: PageHeaderService, deps: [{ token: i1$2.ConfigService }], target: i0.ɵɵFactoryTarget.Injectable }); }
     static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "19.2.20", ngImport: i0, type: PageHeaderService, providedIn: 'root' }); }
 }
@@ -1842,7 +1974,7 @@ class PageTitleService {
         ])
             .pipe(filter(([event]) => event instanceof NavigationEnd ||
             event instanceof NavigationStart ||
-            event instanceof ResolveEnd), tap(([_, pageActionsViewContainerRef, preventReset]) => {
+            event instanceof ResolveEnd), tap$1(([_, pageActionsViewContainerRef, preventReset]) => {
             if (!preventReset) {
                 this._customPageTitle$.next('');
                 this._customPageTitleSet$.next(false);
@@ -2498,7 +2630,7 @@ class ValuePathSelectorService extends BaseApiService {
                 prefixes: prefixesWithoutCache,
                 type,
             })
-            : of([])).pipe(tap$1((results) => {
+            : of([])).pipe(tap((results) => {
             if (this._prefixes.length === 0)
                 this._prefixes = this.getPrefixesFromResults(results);
             if (type === ValuePathType.FIELD)
@@ -3770,7 +3902,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.20", ngImpo
  * limitations under the License.
  */
 class TopbarComponent {
-    constructor(keyCloakService, configService, iconService, shellService, sanitizer, pageHeaderService, cdsThemeService) {
+    constructor(adminSettingsService, keyCloakService, configService, iconService, shellService, sanitizer, pageHeaderService, cdsThemeService) {
+        this.adminSettingsService = adminSettingsService;
         this.keyCloakService = keyCloakService;
         this.configService = configService;
         this.iconService = iconService;
@@ -3779,13 +3912,16 @@ class TopbarComponent {
         this.pageHeaderService = pageHeaderService;
         this.cdsThemeService = cdsThemeService;
         this.headerClass = true;
-        this.logoBase64$ = this.cdsThemeService.currentTheme$.pipe(map(currentTheme => {
-            const base64logo = this.getBase64Logo(this.configService.config, currentTheme);
+        this.logoBase64$ = combineLatest([
+            this.cdsThemeService.currentTheme$,
+            this.adminSettingsService.getLogos(),
+        ]).pipe(map(([currentTheme, adminLogos]) => {
+            const base64logo = this.getBase64Logo(this.configService.config, currentTheme, adminLogos);
             return this.sanitizer.bypassSecurityTrustResourceUrl(`${base64logo.isSvg ? 'data:image/svg+xml;base64' : 'data:image/png;base64'}, ${base64logo.base64string}`);
         }));
         this.userFullName$ = of(this.keyCloakService.isLoggedIn()).pipe(switchMap(() => this.keyCloakService.loadUserProfile()), map(profile => `${profile.firstName} ${profile.lastName}`));
         this.applicationTitle = this.configService.config.applicationTitle;
-        this.largeLogoMargin = this.configService.config.featureToggles?.largeLogoMargin;
+        this.largeLogoMargin$ = this.configService.getFeatureToggleObservable('largeLogoMargin');
         this.sideBarExpanded$ = this.shellService.sideBarExpanded$;
         this.largeScreen$ = this.shellService.largeScreen$;
         this.panelExpanded$ = this.shellService.panelExpanded$;
@@ -3810,7 +3946,26 @@ class TopbarComponent {
     mouseLeave() {
         this.shellService.setMouseOnTopBar(false);
     }
-    getBase64Logo(config, currentTheme) {
+    getBase64Logo(config, currentTheme, adminLogos) {
+        const adminLogo = adminLogos?.logo?.imageBase64;
+        const adminLogoDark = adminLogos?.logoDarkMode?.imageBase64;
+        const themeAdminLogo = currentTheme === CurrentCarbonTheme.G10 ? adminLogo : adminLogoDark;
+        if (themeAdminLogo) {
+            return { isSvg: this.isSvg(themeAdminLogo), base64string: themeAdminLogo };
+        }
+        return this.getConfigLogo(currentTheme);
+    }
+    isSvg(base64) {
+        try {
+            const decoded = atob(base64.substring(0, 64));
+            const trimmed = decoded.trimStart();
+            return trimmed.startsWith('<?xml') || trimmed.startsWith('<svg');
+        }
+        catch {
+            return false;
+        }
+    }
+    getConfigLogo(currentTheme) {
         const { logoSvgBase64, logoPngBase64, darkModeLogoSvgBase64, darkModeLogoPngBase64 } = this.configService.config;
         let base64string;
         let isSvg = true;
@@ -3848,18 +4003,15 @@ class TopbarComponent {
                 }
                 break;
         }
-        return {
-            isSvg,
-            base64string,
-        };
+        return { isSvg, base64string };
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.20", ngImport: i0, type: TopbarComponent, deps: [{ token: i1$5.KeycloakService }, { token: i1$2.ConfigService }, { token: i2$2.IconService }, { token: ShellService }, { token: i5.DomSanitizer }, { token: PageHeaderService }, { token: CdsThemeService }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.20", type: TopbarComponent, isStandalone: false, selector: "valtimo-topbar", host: { properties: { "class.cds--header": "this.headerClass" } }, viewQueries: [{ propertyName: "_headerVcr", first: true, predicate: ["headerVcr"], descendants: true, read: ViewContainerRef, static: 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-header [useRouter]=\"false\" (mouseenter)=\"mouseEnter()\" (mouseleave)=\"mouseLeave()\">\n  <a\n    *ngIf=\"logoBase64$ | async as logoBase64\"\n    class=\"logo-link\"\n    [ngClass]=\"{'logo-link--large-margin': largeLogoMargin}\"\n    [routerLink]=\"['/']\"\n    [title]=\"applicationTitle\"\n  >\n    <img [src]=\"logoBase64\" class=\"logo-image\" />\n  </a>\n  <cds-hamburger\n    *ngIf=\"(largeScreen$ | async) === false || (collapsibleWidescreenMenu$ | async)\"\n    [active]=\"sideBarExpanded$ | async\"\n    (selected)=\"toggleSideBar()\"\n  ></cds-hamburger>\n  <cds-header-global>\n    <ng-container #headerVcr></ng-container>\n\n    <ng-container *ngTemplateOutlet=\"userFullName\"></ng-container>\n\n    <cds-header-action\n      title=\"action\"\n      [active]=\"panelExpanded$ | async\"\n      (activeChange)=\"setPanelExpanded($event)\"\n    >\n      <svg cdsIcon=\"user\" size=\"20\"></svg>\n    </cds-header-action>\n  </cds-header-global>\n</cds-header>\n\n<ng-template #userFullName>\n  <div\n    class=\"user-full-name\"\n    *ngIf=\"(showUserNameInTopBar$ | async) && {userFullName: userFullName$ | async} as obs\"\n  >\n    <v-paragraph [loading]=\"!obs.userFullName\">{{ obs.userFullName }}</v-paragraph>\n  </div>\n</ng-template>\n", styles: [".user-icon{font-size:30px}.be-toggle-right-sidebar{display:flex}.user-full-name{display:flex;height:100%;align-items:center;justify-content:center;margin-inline-end:var(--v-top-bar-user-name-spacing);flex-shrink:0}::ng-deep .cds--header__name{display:none!important}.logo-link{height:100%;padding-left:16px;padding-top:8px;padding-bottom:8px}.logo-link--large-margin{padding-top:16px;padding-bottom:16px}.logo-image{height:100%;object-fit:contain}\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.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1$4.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i1$3.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "component", type: ParagraphComponent, selector: "v-paragraph", inputs: ["center", "fullWidth", "margin", "italic", "loading", "dataTestId"] }, { kind: "component", type: i2$2.Header, selector: "cds-header, ibm-header", inputs: ["skipTo", "name", "brand", "href", "route", "routeExtras", "useRouter"], outputs: ["navigation"] }, { kind: "component", type: i2$2.HeaderGlobal, selector: "cds-header-global, ibm-header-global" }, { kind: "component", type: i2$2.HeaderAction, selector: "cds-header-action, ibm-header-action", inputs: ["description", "ariaLabel", "active"], outputs: ["activeChange", "selected"] }, { kind: "component", type: i2$2.Hamburger, selector: "cds-hamburger, ibm-hamburger", inputs: ["active", "activeTitle", "inactiveTitle"], outputs: ["selected"] }, { kind: "directive", type: i2$2.IconDirective, selector: "[cdsIcon], [ibmIcon]", inputs: ["ibmIcon", "cdsIcon", "size", "title", "ariaLabel", "ariaLabelledBy", "ariaHidden", "isFocusable"] }, { kind: "pipe", type: i1$4.AsyncPipe, name: "async" }] }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.20", ngImport: i0, type: TopbarComponent, deps: [{ token: AdminSettingsService }, { token: i2$2.KeycloakService }, { token: i1$2.ConfigService }, { token: i2$3.IconService }, { token: ShellService }, { token: i6.DomSanitizer }, { token: PageHeaderService }, { token: CdsThemeService }], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.20", type: TopbarComponent, isStandalone: false, selector: "valtimo-topbar", host: { properties: { "class.cds--header": "this.headerClass" } }, viewQueries: [{ propertyName: "_headerVcr", first: true, predicate: ["headerVcr"], descendants: true, read: ViewContainerRef, static: 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-header [useRouter]=\"false\" (mouseenter)=\"mouseEnter()\" (mouseleave)=\"mouseLeave()\">\n  <a\n    *ngIf=\"logoBase64$ | async as logoBase64\"\n    class=\"logo-link\"\n    [ngClass]=\"{'logo-link--large-margin': largeLogoMargin$ | async}\"\n    [routerLink]=\"['/']\"\n    [title]=\"applicationTitle\"\n  >\n    <img [src]=\"logoBase64\" class=\"logo-image\" />\n  </a>\n  <cds-hamburger\n    *ngIf=\"(largeScreen$ | async) === false || (collapsibleWidescreenMenu$ | async)\"\n    [active]=\"sideBarExpanded$ | async\"\n    (selected)=\"toggleSideBar()\"\n  ></cds-hamburger>\n  <cds-header-global>\n    <ng-container #headerVcr></ng-container>\n\n    <ng-container *ngTemplateOutlet=\"userFullName\"></ng-container>\n\n    <cds-header-action\n      title=\"action\"\n      [active]=\"panelExpanded$ | async\"\n      (activeChange)=\"setPanelExpanded($event)\"\n    >\n      <svg cdsIcon=\"user\" size=\"20\"></svg>\n    </cds-header-action>\n  </cds-header-global>\n</cds-header>\n\n<ng-template #userFullName>\n  <div\n    class=\"user-full-name\"\n    *ngIf=\"(showUserNameInTopBar$ | async) && {userFullName: userFullName$ | async} as obs\"\n  >\n    <v-paragraph [loading]=\"!obs.userFullName\">{{ obs.userFullName }}</v-paragraph>\n  </div>\n</ng-template>\n", styles: [".user-icon{font-size:30px}.be-toggle-right-sidebar{display:flex}.user-full-name{display:flex;height:100%;align-items:center;justify-content:center;margin-inline-end:var(--v-top-bar-user-name-spacing);flex-shrink:0}::ng-deep .cds--header__name{display:none!important}.logo-link{height:100%;padding-left:16px;padding-top:8px;padding-bottom:8px}.logo-link--large-margin{padding-top:16px;padding-bottom:16px}.logo-image{height:100%;object-fit:contain}\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.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1$4.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i1$3.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "component", type: ParagraphComponent, selector: "v-paragraph", inputs: ["center", "fullWidth", "margin", "italic", "loading", "dataTestId"] }, { kind: "component", type: i2$3.Header, selector: "cds-header, ibm-header", inputs: ["skipTo", "name", "brand", "href", "route", "routeExtras", "useRouter"], outputs: ["navigation"] }, { kind: "component", type: i2$3.HeaderGlobal, selector: "cds-header-global, ibm-header-global" }, { kind: "component", type: i2$3.HeaderAction, selector: "cds-header-action, ibm-header-action", inputs: ["description", "ariaLabel", "active"], outputs: ["activeChange", "selected"] }, { kind: "component", type: i2$3.Hamburger, selector: "cds-hamburger, ibm-hamburger", inputs: ["active", "activeTitle", "inactiveTitle"], outputs: ["selected"] }, { kind: "directive", type: i2$3.IconDirective, selector: "[cdsIcon], [ibmIcon]", inputs: ["ibmIcon", "cdsIcon", "size", "title", "ariaLabel", "ariaLabelledBy", "ariaHidden", "isFocusable"] }, { kind: "pipe", type: i1$4.AsyncPipe, name: "async" }] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.20", ngImport: i0, type: TopbarComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'valtimo-topbar', 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-header [useRouter]=\"false\" (mouseenter)=\"mouseEnter()\" (mouseleave)=\"mouseLeave()\">\n  <a\n    *ngIf=\"logoBase64$ | async as logoBase64\"\n    class=\"logo-link\"\n    [ngClass]=\"{'logo-link--large-margin': largeLogoMargin}\"\n    [routerLink]=\"['/']\"\n    [title]=\"applicationTitle\"\n  >\n    <img [src]=\"logoBase64\" class=\"logo-image\" />\n  </a>\n  <cds-hamburger\n    *ngIf=\"(largeScreen$ | async) === false || (collapsibleWidescreenMenu$ | async)\"\n    [active]=\"sideBarExpanded$ | async\"\n    (selected)=\"toggleSideBar()\"\n  ></cds-hamburger>\n  <cds-header-global>\n    <ng-container #headerVcr></ng-container>\n\n    <ng-container *ngTemplateOutlet=\"userFullName\"></ng-container>\n\n    <cds-header-action\n      title=\"action\"\n      [active]=\"panelExpanded$ | async\"\n      (activeChange)=\"setPanelExpanded($event)\"\n    >\n      <svg cdsIcon=\"user\" size=\"20\"></svg>\n    </cds-header-action>\n  </cds-header-global>\n</cds-header>\n\n<ng-template #userFullName>\n  <div\n    class=\"user-full-name\"\n    *ngIf=\"(showUserNameInTopBar$ | async) && {userFullName: userFullName$ | async} as obs\"\n  >\n    <v-paragraph [loading]=\"!obs.userFullName\">{{ obs.userFullName }}</v-paragraph>\n  </div>\n</ng-template>\n", styles: [".user-icon{font-size:30px}.be-toggle-right-sidebar{display:flex}.user-full-name{display:flex;height:100%;align-items:center;justify-content:center;margin-inline-end:var(--v-top-bar-user-name-spacing);flex-shrink:0}::ng-deep .cds--header__name{display:none!important}.logo-link{height:100%;padding-left:16px;padding-top:8px;padding-bottom:8px}.logo-link--large-margin{padding-top:16px;padding-bottom:16px}.logo-image{height:100%;object-fit:contain}\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: i1$5.KeycloakService }, { type: i1$2.ConfigService }, { type: i2$2.IconService }, { type: ShellService }, { type: i5.DomSanitizer }, { type: PageHeaderService }, { type: CdsThemeService }], propDecorators: { headerClass: [{
+            args: [{ selector: 'valtimo-topbar', 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-header [useRouter]=\"false\" (mouseenter)=\"mouseEnter()\" (mouseleave)=\"mouseLeave()\">\n  <a\n    *ngIf=\"logoBase64$ | async as logoBase64\"\n    class=\"logo-link\"\n    [ngClass]=\"{'logo-link--large-margin': largeLogoMargin$ | async}\"\n    [routerLink]=\"['/']\"\n    [title]=\"applicationTitle\"\n  >\n    <img [src]=\"logoBase64\" class=\"logo-image\" />\n  </a>\n  <cds-hamburger\n    *ngIf=\"(largeScreen$ | async) === false || (collapsibleWidescreenMenu$ | async)\"\n    [active]=\"sideBarExpanded$ | async\"\n    (selected)=\"toggleSideBar()\"\n  ></cds-hamburger>\n  <cds-header-global>\n    <ng-container #headerVcr></ng-container>\n\n    <ng-container *ngTemplateOutlet=\"userFullName\"></ng-container>\n\n    <cds-header-action\n      title=\"action\"\n      [active]=\"panelExpanded$ | async\"\n      (activeChange)=\"setPanelExpanded($event)\"\n    >\n      <svg cdsIcon=\"user\" size=\"20\"></svg>\n    </cds-header-action>\n  </cds-header-global>\n</cds-header>\n\n<ng-template #userFullName>\n  <div\n    class=\"user-full-name\"\n    *ngIf=\"(showUserNameInTopBar$ | async) && {userFullName: userFullName$ | async} as obs\"\n  >\n    <v-paragraph [loading]=\"!obs.userFullName\">{{ obs.userFullName }}</v-paragraph>\n  </div>\n</ng-template>\n", styles: [".user-icon{font-size:30px}.be-toggle-right-sidebar{display:flex}.user-full-name{display:flex;height:100%;align-items:center;justify-content:center;margin-inline-end:var(--v-top-bar-user-name-spacing);flex-shrink:0}::ng-deep .cds--header__name{display:none!important}.logo-link{height:100%;padding-left:16px;padding-top:8px;padding-bottom:8px}.logo-link--large-margin{padding-top:16px;padding-bottom:16px}.logo-image{height:100%;object-fit:contain}\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: AdminSettingsService }, { type: i2$2.KeycloakService }, { type: i1$2.ConfigService }, { type: i2$3.IconService }, { type: ShellService }, { type: i6.DomSanitizer }, { type: PageHeaderService }, { type: CdsThemeService }], propDecorators: { headerClass: [{
                 type: HostBinding,
                 args: ['class.cds--header']
             }], _headerVcr: [{
@@ -3994,7 +4146,7 @@ class MenuService {
                 item.children?.forEach(child => {
                     if (Array.isArray(child.link)) {
                         const fullLink = [...(item.link || []), ...child.link].join('/');
-                        checkItemMatch(fullLink, `${item.sequence}${child.sequence}`, `${item.sequence}`);
+                        checkItemMatch(fullLink, `${item.sequence}.${child.sequence}`, `${item.sequence}`);
                     }
                 });
             });
@@ -4037,7 +4189,7 @@ class MenuService {
     loadMenuItems(userRoles) {
         let menuItems = [];
         this.menuConfig.menuItems.forEach(menuItem => {
-            if (menuItem.includeFunction) {
+            if (menuItem.includeFunction !== undefined) {
                 this.includeFunctionObservables[menuItem.title] =
                     this.menuIncludeService.getIncludeFunction(menuItem.includeFunction);
             }
@@ -4047,7 +4199,17 @@ class MenuService {
                 menuItems.push({ ...menuItem, ...(filteredChildren && { children: filteredChildren }) });
             }
         });
-        return menuItems.sort((a, b) => a.sequence - b.sequence);
+        return menuItems;
+    }
+    assignSequences(menuItems) {
+        return menuItems.map((item, index) => ({
+            ...item,
+            sequence: index,
+            children: item.children?.map((child, childIndex) => ({
+                ...child,
+                sequence: childIndex,
+            })),
+        }));
     }
     applyMenuRoleSecurity(menuItems) {
         this.userProviderService.getUserSubject().subscribe(user => {
@@ -4073,7 +4235,7 @@ class MenuService {
             const operators = appendMenuItemsFunctions.map(fn => switchMap(fn));
             // @ts-ignore
             return sourceObs.pipe(...operators);
-        }), map$1(items => this.applyMenuRoleSecurity(items)), tap(items => {
+        }), map$1(items => this.applyMenuRoleSecurity(items)), map$1(items => this.assignSequences(items)), tap$1(items => {
             if (!isEqual(this._menuItems$.getValue(), items))
                 this._menuItems$.next(items);
         }))
@@ -4085,13 +4247,13 @@ class MenuService {
             functionValue,
         ]);
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.20", ngImport: i0, type: MenuService, deps: [{ token: i1$2.ConfigService }, { token: i1$1.HttpClient }, { token: i4.NGXLogger }, { token: i1$2.MenuIncludeService }, { token: PendingChangesService }, { token: i1$3.Router }, { token: i6.UserProviderService }, { token: i1$5.KeycloakService }], target: i0.ɵɵFactoryTarget.Injectable }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.20", ngImport: i0, type: MenuService, deps: [{ token: i1$2.ConfigService }, { token: i1$1.HttpClient }, { token: i4.NGXLogger }, { token: i1$2.MenuIncludeService }, { token: PendingChangesService }, { token: i1$3.Router }, { token: i6$1.UserProviderService }, { token: i2$2.KeycloakService }], target: i0.ɵɵFactoryTarget.Injectable }); }
     static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "19.2.20", ngImport: i0, type: MenuService, providedIn: 'root' }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.20", ngImport: i0, type: MenuService, decorators: [{
             type: Injectable,
             args: [{ providedIn: 'root' }]
-        }], ctorParameters: () => [{ type: i1$2.ConfigService }, { type: i1$1.HttpClient }, { type: i4.NGXLogger }, { type: i1$2.MenuIncludeService }, { type: PendingChangesService }, { type: i1$3.Router }, { type: i6.UserProviderService }, { type: i1$5.KeycloakService }] });
+        }], ctorParameters: () => [{ type: i1$2.ConfigService }, { type: i1$1.HttpClient }, { type: i4.NGXLogger }, { type: i1$2.MenuIncludeService }, { type: PendingChangesService }, { type: i1$3.Router }, { type: i6$1.UserProviderService }, { type: i2$2.KeycloakService }] });
 
 /*
  * Copyright 2015-2025 Ritense BV, the Netherlands.
@@ -4663,18 +4825,18 @@ class RightSidebarComponent {
                 selected: preferredTheme === SelectableCarbonTheme.SYSTEM,
             },
         ]));
-        this.allowUserThemeSwitching = true;
-        this.enableCompactModeToggle = true;
-        this.enableShowUserNameToggle = false;
-        this.showPlantATreeButton = false;
-        this._hideValtimoVersionsForNonAdmins = false;
+        this.allowUserThemeSwitching$ = this.configService.getFeatureToggleObservable('allowUserThemeSwitching', true);
+        this.enableCompactModeToggle$ = this.configService.getFeatureToggleObservable('enableCompactModeToggle', true);
+        this.enableShowUserNameToggle$ = this.configService.getFeatureToggleObservable('enableUserNameInTopBarToggle');
+        this.showPlantATreeButton$ = this.configService.getFeatureToggleObservable('showPlantATreeButton');
+        this.hideValtimoVersionsForNonAdmins$ = this.configService.getFeatureToggleObservable('hideValtimoVersionsForNonAdmins');
         this._isAdmin$ = this.userProviderService
             .getUserSubject()
             .pipe(map$1(userIdentity => userIdentity?.roles.includes('ROLE_ADMIN')));
         this._subscriptions = new Subscription();
     }
     ngOnInit() {
-        this.initSettings();
+        this.initNonToggleSettings();
         this.initFrontendVersion();
         this.openShowVersionsSubscription();
         this.setLanguage();
@@ -4717,37 +4879,23 @@ class RightSidebarComponent {
         }
     }
     setPreferredTheme(selectedTheme, saveSettings = true) {
-        if (this.allowUserThemeSwitching) {
-            if (selectedTheme?.item?.key) {
-                this.cdsThemeService.setPreferredTheme(selectedTheme.item?.key);
-            }
-            else {
-                this.cdsThemeService.setPreferredTheme(selectedTheme);
-            }
-            if (saveSettings) {
-                this.saveUserSettings();
-            }
+        if (selectedTheme?.item?.key) {
+            this.cdsThemeService.setPreferredTheme(selectedTheme.item?.key);
+        }
+        else {
+            this.cdsThemeService.setPreferredTheme(selectedTheme);
+        }
+        if (saveSettings) {
+            this.saveUserSettings();
         }
     }
     logout() {
         this.userProviderService.logout();
     }
-    initSettings() {
+    initNonToggleSettings() {
         const config = this.configService?.config;
-        const featureToggles = config?.featureToggles || {};
         this.resetUrl = config?.changePasswordUrl?.endpointUri;
         this.overrideFeedbackMenuItemToMailTo = config?.overrideFeedbackMenuItemToMailTo;
-        this.enableShowUserNameToggle = !!featureToggles.enableUserNameInTopBarToggle;
-        this.showPlantATreeButton = !!featureToggles.showPlantATreeButton;
-        if (featureToggles.hasOwnProperty('allowUserThemeSwitching')) {
-            this.allowUserThemeSwitching = !!featureToggles.allowUserThemeSwitching;
-        }
-        if (featureToggles.hasOwnProperty('enableCompactModeToggle')) {
-            this.enableCompactModeToggle = !!featureToggles.enableCompactModeToggle;
-        }
-        if (featureToggles.hasOwnProperty('hideValtimoVersionsForNonAdmins')) {
-            this._hideValtimoVersionsForNonAdmins = !!featureToggles.hideValtimoVersionsForNonAdmins;
-        }
     }
     initFrontendVersion() {
         this.frontendVersion = VERSIONS?.frontendLibraries;
@@ -4783,13 +4931,16 @@ class RightSidebarComponent {
             this.compactMode$,
             this.showUserNameInTopBar$,
             this._preferredTheme$,
+            this.enableCompactModeToggle$,
+            this.enableShowUserNameToggle$,
+            this.allowUserThemeSwitching$,
         ])
-            .pipe(take$1(1), switchMap(([languageCode, collapsibleWidescreenMenu, compactMode, showUserNameInTopBar, preferredTheme,]) => this.userSettingsService.saveUserSettings({
+            .pipe(take$1(1), switchMap(([languageCode, collapsibleWidescreenMenu, compactMode, showUserNameInTopBar, preferredTheme, enableCompactModeToggle, enableShowUserNameToggle, allowUserThemeSwitching,]) => this.userSettingsService.saveUserSettings({
             collapsibleWidescreenMenu,
             languageCode,
-            ...(this.enableCompactModeToggle && { compactMode }),
-            ...(this.enableShowUserNameToggle && { showUserNameInTopBar }),
-            ...(this.allowUserThemeSwitching && { preferredTheme }),
+            ...(enableCompactModeToggle && { compactMode }),
+            ...(enableShowUserNameToggle && { showUserNameInTopBar }),
+            ...(allowUserThemeSwitching && { preferredTheme }),
         })))
             .subscribe(() => {
             this.updatingUserSettings$.next(false);
@@ -4799,28 +4950,34 @@ class RightSidebarComponent {
         this._selectedLanguage$.next(settings.languageCode);
         this.updateUserLanguage(settings.languageCode, false);
         this.setCollapsibleWidescreenMenu(settings.collapsibleWidescreenMenu, false);
-        if (this.enableCompactModeToggle)
-            this.setCompactMode(settings.compactMode, false);
-        if (this.enableShowUserNameToggle)
-            this.setShowUserName(settings.showUserNameInTopBar, false);
-        if (settings.preferredTheme && this.allowUserThemeSwitching) {
-            this.setPreferredTheme(settings.preferredTheme, false);
-        }
+        combineLatest([
+            this.enableCompactModeToggle$,
+            this.enableShowUserNameToggle$,
+            this.allowUserThemeSwitching$,
+        ])
+            .pipe(take$1(1))
+            .subscribe(([enableCompactModeToggle, enableShowUserNameToggle, allowUserThemeSwitching]) => {
+            if (enableCompactModeToggle)
+                this.setCompactMode(settings.compactMode, false);
+            if (enableShowUserNameToggle)
+                this.setShowUserName(settings.showUserNameInTopBar, false);
+            if (settings.preferredTheme && allowUserThemeSwitching) {
+                this.setPreferredTheme(settings.preferredTheme, false);
+            }
+        });
     }
     openShowVersionsSubscription() {
-        this._subscriptions.add(this._isAdmin$.subscribe(isAdmin => {
-            if (this._hideValtimoVersionsForNonAdmins && !isAdmin) {
-                this.showValtimoVersions = false;
-            }
+        this._subscriptions.add(combineLatest([this._isAdmin$, this.hideValtimoVersionsForNonAdmins$]).subscribe(([isAdmin, hideForNonAdmins]) => {
+            this.showValtimoVersions = !(hideForNonAdmins && !isAdmin);
         }));
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.20", ngImport: i0, type: RightSidebarComponent, deps: [{ token: i1.TranslateService }, { token: i6.UserProviderService }, { token: i2.FormBuilder }, { token: VersionService }, { token: ShellService }, { token: i0.ElementRef }, { token: i1$2.ConfigService }, { token: i1$2.UserSettingsService }, { token: PageHeaderService }, { token: CdsThemeService }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.20", type: RightSidebarComponent, isStandalone: false, selector: "valtimo-right-sidebar", host: { listeners: { "document:click": "onPageClick($event.target)" } }, 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 class=\"right-sidebar-menu\">\n  <cds-panel [expanded]=\"panelExpanded$ | async\">\n    <div cdsGrid [condensed]=\"true\">\n      <div cdsRow>\n        <div cdsCol [columnNumbers]=\"{lg: 16}\" class=\"menu-tabs\" cdsLayer>\n          <cds-tabs class=\"cds--tab--list--full-width\">\n            <cds-tab [heading]=\"'account.title' | translate\">\n              <ng-container *ngTemplateOutlet=\"accountTabTemplate\"></ng-container>\n            </cds-tab>\n\n            <cds-tab [heading]=\"'settings.title' | translate\" [attr.data-test-id]=\"testIds.settingsTab\">\n              <ng-container *ngTemplateOutlet=\"settingsTabTemplate\"></ng-container>\n            </cds-tab>\n          </cds-tabs>\n        </div>\n      </div>\n    </div>\n  </cds-panel>\n</div>\n\n<ng-template #accountTabTemplate>\n  <ng-container *ngTemplateOutlet=\"accountInformationTemplate\"></ng-container>\n\n  <ng-container *ngTemplateOutlet=\"linksTemplate\"></ng-container>\n</ng-template>\n\n<ng-template #settingsTabTemplate>\n  <ng-container *ngTemplateOutlet=\"languageSettingsTemplate\"></ng-container>\n\n  <ng-container *ngTemplateOutlet=\"interfaceSettingsTemplate\"></ng-container>\n\n  @if (showValtimoVersions) {\n    <ng-container *ngTemplateOutlet=\"versionTemplate\"></ng-container>\n  }\n</ng-template>\n\n<ng-template #accountInformationTemplate>\n  <cds-structured-list>\n    <cds-list-header>\n      <cds-list-column>{{ 'account.informationTitle' | translate }}</cds-list-column>\n    </cds-list-header>\n\n    <cds-list-row>\n      <cds-list-column>\n        <ng-container *ngTemplateOutlet=\"accountInformationTableTemplate\"></ng-container>\n      </cds-list-column>\n    </cds-list-row>\n  </cds-structured-list>\n</ng-template>\n\n<ng-template #accountInformationTableTemplate>\n  <div class=\"information-table account-information\">\n    <cds-structured-list *ngIf=\"userSubject$ | async as userSubject\">\n      <cds-list-row>\n        <cds-list-column\n          >{{ 'interface.email' | translate }}\n          <cds-tag type=\"blue\">{{ userSubject.email }}</cds-tag>\n        </cds-list-column>\n      </cds-list-row>\n\n      <cds-list-row>\n        <cds-list-column\n          >{{ 'interface.username' | translate }}\n          <cds-tag type=\"blue\">{{ userSubject.username }}</cds-tag>\n        </cds-list-column>\n      </cds-list-row>\n\n      <cds-list-row>\n        <cds-list-column\n          >{{ 'interface.name' | translate }}\n          <cds-tag type=\"blue\">{{ userSubject.firstName + ' ' + userSubject.lastName }}</cds-tag>\n        </cds-list-column>\n      </cds-list-row>\n    </cds-structured-list>\n  </div>\n</ng-template>\n\n<ng-template #linksTemplate>\n  <cds-structured-list>\n    <cds-list-header>\n      <cds-list-column>{{ 'account.quickLinks' | translate }}</cds-list-column>\n    </cds-list-header>\n\n    <cds-list-row>\n      <cds-list-column>\n        <ng-container *ngTemplateOutlet=\"linksTableTemplate\"></ng-container>\n      </cds-list-column>\n    </cds-list-row>\n  </cds-structured-list>\n</ng-template>\n\n<ng-template #linksTableTemplate>\n  <div class=\"information-table\">\n    <cds-structured-list>\n      <cds-list-row>\n        <cds-list-column>\n          <a href=\"https://docs.valtimo.nl\" target=\"_blank\" cdsLink>{{\n            'account.links.help' | translate\n          }}</a>\n        </cds-list-column>\n      </cds-list-row>\n\n      <cds-list-row>\n        <cds-list-column *ngIf=\"!overrideFeedbackMenuItemToMailTo; else feedbackMailTo\">\n          <a href=\"https://www.valtimo.nl/feedback\" target=\"_blank\" cdsLink>{{\n            'account.links.feedback' | translate\n          }}</a>\n        </cds-list-column>\n      </cds-list-row>\n\n      <cds-list-row *ngIf=\"resetUrl\">\n        <cds-list-column>\n          <a [href]=\"resetUrl\" cdsLink>{{ 'account.links.resetPassword' | translate }}</a>\n        </cds-list-column>\n      </cds-list-row>\n\n      <cds-list-row>\n        <cds-list-column>\n          <a href=\"javascript:void(0)\" cdsLink (click)=\"logout()\">{{\n            'account.links.signOut' | translate\n          }}</a>\n        </cds-list-column>\n      </cds-list-row>\n\n      <cds-list-row *ngIf=\"showPlantATreeButton\">\n        <cds-list-column>\n          <a\n            class=\"text-success\"\n            href=\"mailto:valtimo@ritense.com?subject=Plant een boom voor Valtimo&body=Hallo Valtimo gebruiker,%0D%0DMet het versturen van deze e-mail gaan we gelijk aan de slag om een boom te planten. Hiermee compenseren we voor een deel de CO2 uitstoot van je Valtimo gebruik.%0D%0DMet Groene Groet,%0D%0DHet Valtimo team%0D%0D*Deze bomenplantactie kan 1 keer ingezet worden door elke geregistreerde Valtimo gebruiker.%0D%0D** Ritense plant ook jaarlijks bomen voor alle Valtimo installaties die in gebruik zijn.\"\n            target=\"_blank\"\n            cdsLink\n          >\n            {{ 'account.links.plantATree' | translate }}\n          </a>\n        </cds-list-column>\n      </cds-list-row>\n    </cds-structured-list>\n  </div>\n</ng-template>\n\n<ng-template #languageSettingsTemplate>\n  <cds-structured-list>\n    <cds-list-header>\n      <cds-list-column>{{ 'settings.language.title' | translate }}</cds-list-column>\n    </cds-list-header>\n\n    <cds-list-row>\n      <cds-list-column>\n        <cds-dropdown\n          [id]=\"'language-dropdown'\"\n          [attr.data-test-id]=\"testIds.languageDropdown\"\n          [appendInline]=\"true\"\n          [dropUp]=\"false\"\n          (click)=\"$event.stopPropagation()\"\n          (selected)=\"updateUserLanguage($event)\"\n        >\n          <cds-dropdown-list [items]=\"(languageListItems$ | async) || []\"></cds-dropdown-list>\n        </cds-dropdown>\n      </cds-list-column>\n    </cds-list-row>\n  </cds-structured-list>\n</ng-template>\n\n<ng-template #interfaceSettingsTemplate>\n  <cds-structured-list>\n    <cds-list-header>\n      <cds-list-column>{{ 'settings.interface.title' | translate }}</cds-list-column>\n    </cds-list-header>\n\n    <cds-list-row>\n      <cds-list-column>\n        <cds-toggle\n          [label]=\"'settings.interface.collapsibleMenu' | translate\"\n          [onText]=\"'interface.on' | translate\"\n          [offText]=\"'interface.off' | translate\"\n          [disabled]=\"updatingUserSettings$ | async\"\n          [ngModel]=\"collapsibleWidescreenMenu$ | async\"\n          (ngModelChange)=\"setCollapsibleWidescreenMenu($event)\"\n        >\n        </cds-toggle>\n      </cds-list-column>\n    </cds-list-row>\n\n    <cds-list-row *ngIf=\"allowUserThemeSwitching\">\n      <cds-list-column>\n        <cds-dropdown\n          [label]=\"'settings.interface.themePreference' | translate\"\n          [attr.data-test-id]=\"testIds.themeDropdown\"\n          [appendInline]=\"true\"\n          (click)=\"$event.stopPropagation()\"\n          (selected)=\"setPreferredTheme($event)\"\n          [dropUp]=\"false\"\n        >\n          <cds-dropdown-list [items]=\"(themeOptions$ | async) || []\"></cds-dropdown-list>\n        </cds-dropdown>\n      </cds-list-column>\n    </cds-list-row>\n\n    <cds-list-row *ngIf=\"enableCompactModeToggle\">\n      <cds-list-column>\n        <cds-toggle\n          [label]=\"'settings.interface.compactMode' | translate\"\n          [onText]=\"'interface.on' | translate\"\n          [offText]=\"'interface.off' | translate\"\n          [disabled]=\"updatingUserSettings$ | async\"\n          [ngModel]=\"compactMode$ | async\"\n          (ngModelChange)=\"setCompactMode($event)\"\n        >\n        </cds-toggle>\n      </cds-list-column>\n    </cds-list-row>\n\n    <cds-list-row *ngIf=\"enableShowUserNameToggle\">\n      <cds-list-column>\n        <cds-toggle\n          [label]=\"'settings.interface.showUserName' | translate\"\n          [onText]=\"'interface.on' | translate\"\n          [offText]=\"'interface.off' | translate\"\n          [disabled]=\"updatingUserSettings$ | async\"\n          [ngModel]=\"showUserNameInTopBar$ | async\"\n          (ngModelChange)=\"setShowUserName($event)\"\n        >\n        </cds-toggle>\n      </cds-list-column>\n    </cds-list-row>\n  </cds-structured-list>\n</ng-template>\n\n<ng-template #versionTemplate>\n  <ng-container *ngIf=\"{backendVersion: backendVersion$ | async} as obs\">\n    <cds-structured-list *ngIf=\"obs.backendVersion || frontendVersion\">\n      <cds-list-header>\n        <cds-list-column>{{ 'settings.version.title' | translate }}</cds-list-column>\n      </cds-list-header>\n\n      <cds-list-row *ngIf=\"obs.backendVersion\">\n        <cds-list-column>\n          <div class=\"build-information\">\n            <span class=\"build-title\">{{\n              'interface.builds.' + obs.backendVersion.title | translate\n            }}</span>\n            <div class=\"tag-container\">\n              <cds-tag type=\"blue\">{{ obs.backendVersion.version }}</cds-tag>\n            </div>\n          </div>\n        </cds-list-column>\n      </cds-list-row>\n\n      <cds-list-row *ngIf=\"frontendVersion\">\n        <cds-list-column>\n          <div class=\"build-information\">\n            <span class=\"build-title\">{{\n              'interface.builds.valtimo-frontend-libraries' | translate\n            }}</span>\n            <div class=\"tag-container\">\n              <cds-tag type=\"blue\">{{ frontendVersion }}</cds-tag>\n            </div>\n          </div>\n        </cds-list-column>\n      </cds-list-row>\n    </cds-structured-list>\n  </ng-container>\n</ng-template>\n\n<ng-template #feedbackMailTo>\n  <cds-list-column>\n    <a\n      [href]=\"\n        'mailto:' +\n        overrideFeedbackMenuItemToMailTo.email +\n        '?subject=' +\n        (overrideFeedbackMenuItemToMailTo.subjectTranslationKey | translate) +\n        '&body=' +\n        (overrideFeedbackMenuItemToMailTo.bodyTranslationKey | translate)\n      \"\n      target=\"_blank\"\n      cdsLink\n    >\n      {{ 'account.links.feedback' | translate }}\n    </a>\n  </cds-list-column>\n</ng-template>\n", styles: [".be-scroller-settings{padding-bottom:150px!important}.version-holder{position:fixed;bottom:0;width:259px;background-color:#f8f9fa}.info-text{line-height:1em!important;padding-right:70px;margin-bottom:15px}.right-sidebar-menu .cds--tab--list{width:100%}.right-sidebar-menu .menu-tabs .cds--tabs--scrollable__nav-item{width:12rem}.right-sidebar-menu .menu-tabs .cds--tabs--scrollable__nav-item button{width:100%}.right-sidebar-menu .menu-tabs .cds--tab--overflow-nav-button{display:none}.right-sidebar-menu .cds--header-panel{width:20rem;height:calc(100% - 3rem);transition:transform .11s cubic-bezier(.2,0,1,.9);transform:translate(100%)}.right-sidebar-menu .cds--header-panel--expanded{transform:translate(0)}.right-sidebar-menu .cds--panel--overlay{padding-top:0}.right-sidebar-menu .cds--tab-content{padding:0;outline:0}.right-sidebar-menu .cds--structured-list-td{padding-left:1rem;padding-right:1rem}.right-sidebar-menu .toggle-group{display:flex;flex-direction:column}.right-sidebar-menu .toggle-group .description{margin-top:1rem}.right-sidebar-menu cds-structured-list:last-child .cds--structured-list-row:last-child{border-bottom:0}.right-sidebar-menu .cds--grid,.right-sidebar-menu .cds--row,.right-sidebar-menu .menu-tabs{height:100%}.right-sidebar-menu .cds--grid--condensed{padding-left:1rem;padding-right:1rem}.right-sidebar-menu .cds--tab--list--full-width{display:flex;flex-direction:column;height:100%}.right-sidebar-menu cds-tab{overflow:auto}.right-sidebar-menu .build-information{display:inline-flex;flex-direction:column}.right-sidebar-menu .build-information:not(:last-child){margin-bottom:1rem}.right-sidebar-menu .build-information .tag-container .cds--tag{margin-left:0;margin-right:0;margin-bottom:0}.right-sidebar-menu .information-table cds-list-row:first-child{border-top:0}.right-sidebar-menu .information-table cds-list-row:first-child cds-list-column{border-top:0;padding-top:0}.right-sidebar-menu .information-table cds-list-row:last-child cds-list-column{padding-bottom:0}.right-sidebar-menu .information-table cds-list-row cds-list-column:first-child{padding-left:0!important}.account-information .cds--structured-list-td{display:inline-flex;flex-direction:column;border:none;min-width:100%}.account-information .cds--structured-list-td .cds--tag{margin:0;margin-top:.25rem;width:fit-content}.cds--select-input{background-color:var(--cds-field-02)}\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.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1$4.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: i2$2.Panel, selector: "cds-panel, ibm-panel", inputs: ["expanded", "ariaLabel"] }, { kind: "directive", type: i2$2.ColumnDirective, selector: "[cdsCol], [ibmCol]", inputs: ["class", "columnNumbers", "offsets", "columnHang"] }, { kind: "directive", type: i2$2.GridDirective, selector: "[cdsGrid], [ibmGrid]", inputs: ["condensed", "narrow", "fullWidth", "useCssGrid"] }, { kind: "directive", type: i2$2.RowDirective, selector: "[cdsRow], [ibmRow]", inputs: ["condensed", "narrow"] }, { kind: "component", type: i2$2.Tabs, selector: "cds-tabs, ibm-tabs", inputs: ["position", "cacheActive", "followFocus", "isNavigation", "ariaLabel", "ariaLabelledby", "type", "theme", "skeleton"] }, { kind: "component", type: i2$2.Tab, selector: "cds-tab, ibm-tab", inputs: ["heading", "title", "context", "active", "disabled", "tabIndex", "id", "cacheActive", "tabContent", "templateContext"], outputs: ["selected"] }, { kind: "component", type: i2$2.StructuredList, selector: "cds-structured-list, ibm-structured-list", inputs: ["selection", "flushed", "condensed", "name", "skeleton"], outputs: ["selected"] }, { kind: "component", type: i2$2.ListRow, selector: "cds-list-row, ibm-list-row", inputs: ["selected", "label", "value"], outputs: ["change"] }, { kind: "component", type: i2$2.ListHeader, selector: "cds-list-header, ibm-list-header", inputs: ["skeleton"] }, { kind: "component", type: i2$2.ListColumn, selector: "cds-list-column, ibm-list-column", inputs: ["skeleton", "nowrap"] }, { kind: "component", type: i2$2.Toggle, selector: "cds-toggle, ibm-toggle", inputs: ["offText", "onText", "label", "size", "hideLabel", "ariaLabel", "skeleton"] }, { kind: "component", type: i2$2.Tag, selector: "cds-tag, ibm-tag", inputs: ["type", "size", "class", "skeleton"] }, { kind: "directive", type: i2$2.Link, selector: "[cdsLink], [ibmLink]", inputs: ["inline", "disabled"] }, { kind: "component", type: i2$2.Dropdown, selector: "cds-dropdown, ibm-dropdown", inputs: ["id", "label", "hideLabel", "helperText", "placeholder", "displayValue", "clearText", "size", "type", "theme", "disabled", "readonly", "skeleton", "inline", "disableArrowKeys", "invalid", "invalidText", "warn", "warnText", "appendInline", "scrollableContainer", "itemValueKey", "selectionFeedback", "menuButtonLabel", "selectedLabel", "dropUp", "fluid"], outputs: ["selected", "onClose", "close"] }, { kind: "component", type: i2$2.DropdownList, selector: "cds-dropdown-list, ibm-dropdown-list", inputs: ["ariaLabel", "items", "listTpl", "type", "showTitles"], outputs: ["select", "scroll", "blurIntent"] }, { kind: "directive", type: i2$2.LayerDirective, selector: "[cdsLayer], [ibmLayer]", inputs: ["ibmLayer", "cdsLayer"], exportAs: ["layer"] }, { kind: "pipe", type: i1$4.AsyncPipe, name: "async" }, { kind: "pipe", type: i1.TranslatePipe, name: "translate" }], encapsulation: i0.ViewEncapsulation.None }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.20", ngImport: i0, type: RightSidebarComponent, deps: [{ token: i1.TranslateService }, { token: i6$1.UserProviderService }, { token: i2.FormBuilder }, { token: VersionService }, { token: ShellService }, { token: i0.ElementRef }, { token: i1$2.ConfigService }, { token: i1$2.UserSettingsService }, { token: PageHeaderService }, { token: CdsThemeService }], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.20", type: RightSidebarComponent, isStandalone: false, selector: "valtimo-right-sidebar", host: { listeners: { "document:click": "onPageClick($event.target)" } }, 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 class=\"right-sidebar-menu\">\n  <cds-panel [expanded]=\"panelExpanded$ | async\">\n    <div cdsGrid [condensed]=\"true\">\n      <div cdsRow>\n        <div cdsCol [columnNumbers]=\"{lg: 16}\" class=\"menu-tabs\" cdsLayer>\n          <cds-tabs class=\"cds--tab--list--full-width\">\n            <cds-tab [heading]=\"'account.title' | translate\">\n              <ng-container *ngTemplateOutlet=\"accountTabTemplate\"></ng-container>\n            </cds-tab>\n\n            <cds-tab [heading]=\"'settings.title' | translate\" [attr.data-test-id]=\"testIds.settingsTab\">\n              <ng-container *ngTemplateOutlet=\"settingsTabTemplate\"></ng-container>\n            </cds-tab>\n          </cds-tabs>\n        </div>\n      </div>\n    </div>\n  </cds-panel>\n</div>\n\n<ng-template #accountTabTemplate>\n  <ng-container *ngTemplateOutlet=\"accountInformationTemplate\"></ng-container>\n\n  <ng-container *ngTemplateOutlet=\"linksTemplate\"></ng-container>\n</ng-template>\n\n<ng-template #settingsTabTemplate>\n  <ng-container *ngTemplateOutlet=\"languageSettingsTemplate\"></ng-container>\n\n  <ng-container *ngTemplateOutlet=\"interfaceSettingsTemplate\"></ng-container>\n\n  @if (showValtimoVersions) {\n    <ng-container *ngTemplateOutlet=\"versionTemplate\"></ng-container>\n  }\n</ng-template>\n\n<ng-template #accountInformationTemplate>\n  <cds-structured-list>\n    <cds-list-header>\n      <cds-list-column>{{ 'account.informationTitle' | translate }}</cds-list-column>\n    </cds-list-header>\n\n    <cds-list-row>\n      <cds-list-column>\n        <ng-container *ngTemplateOutlet=\"accountInformationTableTemplate\"></ng-container>\n      </cds-list-column>\n    </cds-list-row>\n  </cds-structured-list>\n</ng-template>\n\n<ng-template #accountInformationTableTemplate>\n  <div class=\"information-table account-information\">\n    <cds-structured-list *ngIf=\"userSubject$ | async as userSubject\">\n      <cds-list-row>\n        <cds-list-column\n          >{{ 'interface.email' | translate }}\n          <cds-tag type=\"blue\">{{ userSubject.email }}</cds-tag>\n        </cds-list-column>\n      </cds-list-row>\n\n      <cds-list-row>\n        <cds-list-column\n          >{{ 'interface.username' | translate }}\n          <cds-tag type=\"blue\">{{ userSubject.username }}</cds-tag>\n        </cds-list-column>\n      </cds-list-row>\n\n      <cds-list-row>\n        <cds-list-column\n          >{{ 'interface.name' | translate }}\n          <cds-tag type=\"blue\">{{ userSubject.firstName + ' ' + userSubject.lastName }}</cds-tag>\n        </cds-list-column>\n      </cds-list-row>\n    </cds-structured-list>\n  </div>\n</ng-template>\n\n<ng-template #linksTemplate>\n  <cds-structured-list>\n    <cds-list-header>\n      <cds-list-column>{{ 'account.quickLinks' | translate }}</cds-list-column>\n    </cds-list-header>\n\n    <cds-list-row>\n      <cds-list-column>\n        <ng-container *ngTemplateOutlet=\"linksTableTemplate\"></ng-container>\n      </cds-list-column>\n    </cds-list-row>\n  </cds-structured-list>\n</ng-template>\n\n<ng-template #linksTableTemplate>\n  <div class=\"information-table\">\n    <cds-structured-list>\n      <cds-list-row>\n        <cds-list-column>\n          <a href=\"https://docs.valtimo.nl\" target=\"_blank\" cdsLink>{{\n            'account.links.help' | translate\n          }}</a>\n        </cds-list-column>\n      </cds-list-row>\n\n      <cds-list-row>\n        <cds-list-column *ngIf=\"!overrideFeedbackMenuItemToMailTo; else feedbackMailTo\">\n          <a href=\"https://www.valtimo.nl/feedback\" target=\"_blank\" cdsLink>{{\n            'account.links.feedback' | translate\n          }}</a>\n        </cds-list-column>\n      </cds-list-row>\n\n      <cds-list-row *ngIf=\"resetUrl\">\n        <cds-list-column>\n          <a [href]=\"resetUrl\" cdsLink>{{ 'account.links.resetPassword' | translate }}</a>\n        </cds-list-column>\n      </cds-list-row>\n\n      <cds-list-row>\n        <cds-list-column>\n          <a href=\"javascript:void(0)\" cdsLink (click)=\"logout()\">{{\n            'account.links.signOut' | translate\n          }}</a>\n        </cds-list-column>\n      </cds-list-row>\n\n      <cds-list-row *ngIf=\"showPlantATreeButton$ | async\">\n        <cds-list-column>\n          <a\n            class=\"text-success\"\n            href=\"mailto:valtimo@ritense.com?subject=Plant een boom voor Valtimo&body=Hallo Valtimo gebruiker,%0D%0DMet het versturen van deze e-mail gaan we gelijk aan de slag om een boom te planten. Hiermee compenseren we voor een deel de CO2 uitstoot van je Valtimo gebruik.%0D%0DMet Groene Groet,%0D%0DHet Valtimo team%0D%0D*Deze bomenplantactie kan 1 keer ingezet worden door elke geregistreerde Valtimo gebruiker.%0D%0D** Ritense plant ook jaarlijks bomen voor alle Valtimo installaties die in gebruik zijn.\"\n            target=\"_blank\"\n            cdsLink\n          >\n            {{ 'account.links.plantATree' | translate }}\n          </a>\n        </cds-list-column>\n      </cds-list-row>\n    </cds-structured-list>\n  </div>\n</ng-template>\n\n<ng-template #languageSettingsTemplate>\n  <cds-structured-list>\n    <cds-list-header>\n      <cds-list-column>{{ 'settings.language.title' | translate }}</cds-list-column>\n    </cds-list-header>\n\n    <cds-list-row>\n      <cds-list-column>\n        <cds-dropdown\n          [id]=\"'language-dropdown'\"\n          [attr.data-test-id]=\"testIds.languageDropdown\"\n          [appendInline]=\"true\"\n          [dropUp]=\"false\"\n          (click)=\"$event.stopPropagation()\"\n          (selected)=\"updateUserLanguage($event)\"\n        >\n          <cds-dropdown-list [items]=\"(languageListItems$ | async) || []\"></cds-dropdown-list>\n        </cds-dropdown>\n      </cds-list-column>\n    </cds-list-row>\n  </cds-structured-list>\n</ng-template>\n\n<ng-template #interfaceSettingsTemplate>\n  <cds-structured-list>\n    <cds-list-header>\n      <cds-list-column>{{ 'settings.interface.title' | translate }}</cds-list-column>\n    </cds-list-header>\n\n    <cds-list-row>\n      <cds-list-column>\n        <cds-toggle\n          [label]=\"'settings.interface.collapsibleMenu' | translate\"\n          [onText]=\"'interface.on' | translate\"\n          [offText]=\"'interface.off' | translate\"\n          [disabled]=\"updatingUserSettings$ | async\"\n          [ngModel]=\"collapsibleWidescreenMenu$ | async\"\n          (ngModelChange)=\"setCollapsibleWidescreenMenu($event)\"\n        >\n        </cds-toggle>\n      </cds-list-column>\n    </cds-list-row>\n\n    <cds-list-row *ngIf=\"allowUserThemeSwitching$ | async\">\n      <cds-list-column>\n        <cds-dropdown\n          [label]=\"'settings.interface.themePreference' | translate\"\n          [attr.data-test-id]=\"testIds.themeDropdown\"\n          [appendInline]=\"true\"\n          (click)=\"$event.stopPropagation()\"\n          (selected)=\"setPreferredTheme($event)\"\n          [dropUp]=\"false\"\n        >\n          <cds-dropdown-list [items]=\"(themeOptions$ | async) || []\"></cds-dropdown-list>\n        </cds-dropdown>\n      </cds-list-column>\n    </cds-list-row>\n\n    <cds-list-row *ngIf=\"enableCompactModeToggle$ | async\">\n      <cds-list-column>\n        <cds-toggle\n          [label]=\"'settings.interface.compactMode' | translate\"\n          [onText]=\"'interface.on' | translate\"\n          [offText]=\"'interface.off' | translate\"\n          [disabled]=\"updatingUserSettings$ | async\"\n          [ngModel]=\"compactMode$ | async\"\n          (ngModelChange)=\"setCompactMode($event)\"\n        >\n        </cds-toggle>\n      </cds-list-column>\n    </cds-list-row>\n\n    <cds-list-row *ngIf=\"enableShowUserNameToggle$ | async\">\n      <cds-list-column>\n        <cds-toggle\n          [label]=\"'settings.interface.showUserName' | translate\"\n          [onText]=\"'interface.on' | translate\"\n          [offText]=\"'interface.off' | translate\"\n          [disabled]=\"updatingUserSettings$ | async\"\n          [ngModel]=\"showUserNameInTopBar$ | async\"\n          (ngModelChange)=\"setShowUserName($event)\"\n        >\n        </cds-toggle>\n      </cds-list-column>\n    </cds-list-row>\n  </cds-structured-list>\n</ng-template>\n\n<ng-template #versionTemplate>\n  <ng-container *ngIf=\"{backendVersion: backendVersion$ | async} as obs\">\n    <cds-structured-list *ngIf=\"obs.backendVersion || frontendVersion\">\n      <cds-list-header>\n        <cds-list-column>{{ 'settings.version.title' | translate }}</cds-list-column>\n      </cds-list-header>\n\n      <cds-list-row *ngIf=\"obs.backendVersion\">\n        <cds-list-column>\n          <div class=\"build-information\">\n            <span class=\"build-title\">{{\n              'interface.builds.' + obs.backendVersion.title | translate\n            }}</span>\n            <div class=\"tag-container\">\n              <cds-tag type=\"blue\">{{ obs.backendVersion.version }}</cds-tag>\n            </div>\n          </div>\n        </cds-list-column>\n      </cds-list-row>\n\n      <cds-list-row *ngIf=\"frontendVersion\">\n        <cds-list-column>\n          <div class=\"build-information\">\n            <span class=\"build-title\">{{\n              'interface.builds.valtimo-frontend-libraries' | translate\n            }}</span>\n            <div class=\"tag-container\">\n              <cds-tag type=\"blue\">{{ frontendVersion }}</cds-tag>\n            </div>\n          </div>\n        </cds-list-column>\n      </cds-list-row>\n    </cds-structured-list>\n  </ng-container>\n</ng-template>\n\n<ng-template #feedbackMailTo>\n  <cds-list-column>\n    <a\n      [href]=\"\n        'mailto:' +\n        overrideFeedbackMenuItemToMailTo.email +\n        '?subject=' +\n        (overrideFeedbackMenuItemToMailTo.subjectTranslationKey | translate) +\n        '&body=' +\n        (overrideFeedbackMenuItemToMailTo.bodyTranslationKey | translate)\n      \"\n      target=\"_blank\"\n      cdsLink\n    >\n      {{ 'account.links.feedback' | translate }}\n    </a>\n  </cds-list-column>\n</ng-template>\n", styles: [".be-scroller-settings{padding-bottom:150px!important}.version-holder{position:fixed;bottom:0;width:259px;background-color:#f8f9fa}.info-text{line-height:1em!important;padding-right:70px;margin-bottom:15px}.right-sidebar-menu .cds--tab--list{width:100%}.right-sidebar-menu .menu-tabs .cds--tabs--scrollable__nav-item{width:12rem}.right-sidebar-menu .menu-tabs .cds--tabs--scrollable__nav-item button{width:100%}.right-sidebar-menu .menu-tabs .cds--tab--overflow-nav-button{display:none}.right-sidebar-menu .cds--header-panel{width:20rem;height:calc(100% - 3rem);transition:transform .11s cubic-bezier(.2,0,1,.9);transform:translate(100%)}.right-sidebar-menu .cds--header-panel--expanded{transform:translate(0)}.right-sidebar-menu .cds--panel--overlay{padding-top:0}.right-sidebar-menu .cds--tab-content{padding:0;outline:0}.right-sidebar-menu .cds--structured-list-td{padding-left:1rem;padding-right:1rem}.right-sidebar-menu .toggle-group{display:flex;flex-direction:column}.right-sidebar-menu .toggle-group .description{margin-top:1rem}.right-sidebar-menu cds-structured-list:last-child .cds--structured-list-row:last-child{border-bottom:0}.right-sidebar-menu .cds--grid,.right-sidebar-menu .cds--row,.right-sidebar-menu .menu-tabs{height:100%}.right-sidebar-menu .cds--grid--condensed{padding-left:1rem;padding-right:1rem}.right-sidebar-menu .cds--tab--list--full-width{display:flex;flex-direction:column;height:100%}.right-sidebar-menu cds-tab{overflow:auto}.right-sidebar-menu .build-information{display:inline-flex;flex-direction:column}.right-sidebar-menu .build-information:not(:last-child){margin-bottom:1rem}.right-sidebar-menu .build-information .tag-container .cds--tag{margin-left:0;margin-right:0;margin-bottom:0}.right-sidebar-menu .information-table cds-list-row:first-child{border-top:0}.right-sidebar-menu .information-table cds-list-row:first-child cds-list-column{border-top:0;padding-top:0}.right-sidebar-menu .information-table cds-list-row:last-child cds-list-column{padding-bottom:0}.right-sidebar-menu .information-table cds-list-row cds-list-column:first-child{padding-left:0!important}.account-information .cds--structured-list-td{display:inline-flex;flex-direction:column;border:none;min-width:100%}.account-information .cds--structured-list-td .cds--tag{margin:0;margin-top:.25rem;width:fit-content}.cds--select-input{background-color:var(--cds-field-02)}\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.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1$4.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: i2$3.Panel, selector: "cds-panel, ibm-panel", inputs: ["expanded", "ariaLabel"] }, { kind: "directive", type: i2$3.ColumnDirective, selector: "[cdsCol], [ibmCol]", inputs: ["class", "columnNumbers", "offsets", "columnHang"] }, { kind: "directive", type: i2$3.GridDirective, selector: "[cdsGrid], [ibmGrid]", inputs: ["condensed", "narrow", "fullWidth", "useCssGrid"] }, { kind: "directive", type: i2$3.RowDirective, selector: "[cdsRow], [ibmRow]", inputs: ["condensed", "narrow"] }, { kind: "component", type: i2$3.Tabs, selector: "cds-tabs, ibm-tabs", inputs: ["position", "cacheActive", "followFocus", "isNavigation", "ariaLabel", "ariaLabelledby", "type", "theme", "skeleton"] }, { kind: "component", type: i2$3.Tab, selector: "cds-tab, ibm-tab", inputs: ["heading", "title", "context", "active", "disabled", "tabIndex", "id", "cacheActive", "tabContent", "templateContext"], outputs: ["selected"] }, { kind: "component", type: i2$3.StructuredList, selector: "cds-structured-list, ibm-structured-list", inputs: ["selection", "flushed", "condensed", "name", "skeleton"], outputs: ["selected"] }, { kind: "component", type: i2$3.ListRow, selector: "cds-list-row, ibm-list-row", inputs: ["selected", "label", "value"], outputs: ["change"] }, { kind: "component", type: i2$3.ListHeader, selector: "cds-list-header, ibm-list-header", inputs: ["skeleton"] }, { kind: "component", type: i2$3.ListColumn, selector: "cds-list-column, ibm-list-column", inputs: ["skeleton", "nowrap"] }, { kind: "component", type: i2$3.Toggle, selector: "cds-toggle, ibm-toggle", inputs: ["offText", "onText", "label", "size", "hideLabel", "ariaLabel", "skeleton"] }, { kind: "component", type: i2$3.Tag, selector: "cds-tag, ibm-tag", inputs: ["type", "size", "class", "skeleton"] }, { kind: "directive", type: i2$3.Link, selector: "[cdsLink], [ibmLink]", inputs: ["inline", "disabled"] }, { kind: "component", type: i2$3.Dropdown, selector: "cds-dropdown, ibm-dropdown", inputs: ["id", "label", "hideLabel", "helperText", "placeholder", "displayValue", "clearText", "size", "type", "theme", "disabled", "readonly", "skeleton", "inline", "disableArrowKeys", "invalid", "invalidText", "warn", "warnText", "appendInline", "scrollableContainer", "itemValueKey", "selectionFeedback", "menuButtonLabel", "selectedLabel", "dropUp", "fluid"], outputs: ["selected", "onClose", "close"] }, { kind: "component", type: i2$3.DropdownList, selector: "cds-dropdown-list, ibm-dropdown-list", inputs: ["ariaLabel", "items", "listTpl", "type", "showTitles"], outputs: ["select", "scroll", "blurIntent"] }, { kind: "directive", type: i2$3.LayerDirective, selector: "[cdsLayer], [ibmLayer]", inputs: ["ibmLayer", "cdsLayer"], exportAs: ["layer"] }, { kind: "pipe", type: i1$4.AsyncPipe, name: "async" }, { kind: "pipe", type: i1.TranslatePipe, name: "translate" }], encapsulation: i0.ViewEncapsulation.None }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.20", ngImport: i0, type: RightSidebarComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'valtimo-right-sidebar', encapsulation: ViewEncapsulation.None, 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 class=\"right-sidebar-menu\">\n  <cds-panel [expanded]=\"panelExpanded$ | async\">\n    <div cdsGrid [condensed]=\"true\">\n      <div cdsRow>\n        <div cdsCol [columnNumbers]=\"{lg: 16}\" class=\"menu-tabs\" cdsLayer>\n          <cds-tabs class=\"cds--tab--list--full-width\">\n            <cds-tab [heading]=\"'account.title' | translate\">\n              <ng-container *ngTemplateOutlet=\"accountTabTemplate\"></ng-container>\n            </cds-tab>\n\n            <cds-tab [heading]=\"'settings.title' | translate\" [attr.data-test-id]=\"testIds.settingsTab\">\n              <ng-container *ngTemplateOutlet=\"settingsTabTemplate\"></ng-container>\n            </cds-tab>\n          </cds-tabs>\n        </div>\n      </div>\n    </div>\n  </cds-panel>\n</div>\n\n<ng-template #accountTabTemplate>\n  <ng-container *ngTemplateOutlet=\"accountInformationTemplate\"></ng-container>\n\n  <ng-container *ngTemplateOutlet=\"linksTemplate\"></ng-container>\n</ng-template>\n\n<ng-template #settingsTabTemplate>\n  <ng-container *ngTemplateOutlet=\"languageSettingsTemplate\"></ng-container>\n\n  <ng-container *ngTemplateOutlet=\"interfaceSettingsTemplate\"></ng-container>\n\n  @if (showValtimoVersions) {\n    <ng-container *ngTemplateOutlet=\"versionTemplate\"></ng-container>\n  }\n</ng-template>\n\n<ng-template #accountInformationTemplate>\n  <cds-structured-list>\n    <cds-list-header>\n      <cds-list-column>{{ 'account.informationTitle' | translate }}</cds-list-column>\n    </cds-list-header>\n\n    <cds-list-row>\n      <cds-list-column>\n        <ng-container *ngTemplateOutlet=\"accountInformationTableTemplate\"></ng-container>\n      </cds-list-column>\n    </cds-list-row>\n  </cds-structured-list>\n</ng-template>\n\n<ng-template #accountInformationTableTemplate>\n  <div class=\"information-table account-information\">\n    <cds-structured-list *ngIf=\"userSubject$ | async as userSubject\">\n      <cds-list-row>\n        <cds-list-column\n          >{{ 'interface.email' | translate }}\n          <cds-tag type=\"blue\">{{ userSubject.email }}</cds-tag>\n        </cds-list-column>\n      </cds-list-row>\n\n      <cds-list-row>\n        <cds-list-column\n          >{{ 'interface.username' | translate }}\n          <cds-tag type=\"blue\">{{ userSubject.username }}</cds-tag>\n        </cds-list-column>\n      </cds-list-row>\n\n      <cds-list-row>\n        <cds-list-column\n          >{{ 'interface.name' | translate }}\n          <cds-tag type=\"blue\">{{ userSubject.firstName + ' ' + userSubject.lastName }}</cds-tag>\n        </cds-list-column>\n      </cds-list-row>\n    </cds-structured-list>\n  </div>\n</ng-template>\n\n<ng-template #linksTemplate>\n  <cds-structured-list>\n    <cds-list-header>\n      <cds-list-column>{{ 'account.quickLinks' | translate }}</cds-list-column>\n    </cds-list-header>\n\n    <cds-list-row>\n      <cds-list-column>\n        <ng-container *ngTemplateOutlet=\"linksTableTemplate\"></ng-container>\n      </cds-list-column>\n    </cds-list-row>\n  </cds-structured-list>\n</ng-template>\n\n<ng-template #linksTableTemplate>\n  <div class=\"information-table\">\n    <cds-structured-list>\n      <cds-list-row>\n        <cds-list-column>\n          <a href=\"https://docs.valtimo.nl\" target=\"_blank\" cdsLink>{{\n            'account.links.help' | translate\n          }}</a>\n        </cds-list-column>\n      </cds-list-row>\n\n      <cds-list-row>\n        <cds-list-column *ngIf=\"!overrideFeedbackMenuItemToMailTo; else feedbackMailTo\">\n          <a href=\"https://www.valtimo.nl/feedback\" target=\"_blank\" cdsLink>{{\n            'account.links.feedback' | translate\n          }}</a>\n        </cds-list-column>\n      </cds-list-row>\n\n      <cds-list-row *ngIf=\"resetUrl\">\n        <cds-list-column>\n          <a [href]=\"resetUrl\" cdsLink>{{ 'account.links.resetPassword' | translate }}</a>\n        </cds-list-column>\n      </cds-list-row>\n\n      <cds-list-row>\n        <cds-list-column>\n          <a href=\"javascript:void(0)\" cdsLink (click)=\"logout()\">{{\n            'account.links.signOut' | translate\n          }}</a>\n        </cds-list-column>\n      </cds-list-row>\n\n      <cds-list-row *ngIf=\"showPlantATreeButton\">\n        <cds-list-column>\n          <a\n            class=\"text-success\"\n            href=\"mailto:valtimo@ritense.com?subject=Plant een boom voor Valtimo&body=Hallo Valtimo gebruiker,%0D%0DMet het versturen van deze e-mail gaan we gelijk aan de slag om een boom te planten. Hiermee compenseren we voor een deel de CO2 uitstoot van je Valtimo gebruik.%0D%0DMet Groene Groet,%0D%0DHet Valtimo team%0D%0D*Deze bomenplantactie kan 1 keer ingezet worden door elke geregistreerde Valtimo gebruiker.%0D%0D** Ritense plant ook jaarlijks bomen voor alle Valtimo installaties die in gebruik zijn.\"\n            target=\"_blank\"\n            cdsLink\n          >\n            {{ 'account.links.plantATree' | translate }}\n          </a>\n        </cds-list-column>\n      </cds-list-row>\n    </cds-structured-list>\n  </div>\n</ng-template>\n\n<ng-template #languageSettingsTemplate>\n  <cds-structured-list>\n    <cds-list-header>\n      <cds-list-column>{{ 'settings.language.title' | translate }}</cds-list-column>\n    </cds-list-header>\n\n    <cds-list-row>\n      <cds-list-column>\n        <cds-dropdown\n          [id]=\"'language-dropdown'\"\n          [attr.data-test-id]=\"testIds.languageDropdown\"\n          [appendInline]=\"true\"\n          [dropUp]=\"false\"\n          (click)=\"$event.stopPropagation()\"\n          (selected)=\"updateUserLanguage($event)\"\n        >\n          <cds-dropdown-list [items]=\"(languageListItems$ | async) || []\"></cds-dropdown-list>\n        </cds-dropdown>\n      </cds-list-column>\n    </cds-list-row>\n  </cds-structured-list>\n</ng-template>\n\n<ng-template #interfaceSettingsTemplate>\n  <cds-structured-list>\n    <cds-list-header>\n      <cds-list-column>{{ 'settings.interface.title' | translate }}</cds-list-column>\n    </cds-list-header>\n\n    <cds-list-row>\n      <cds-list-column>\n        <cds-toggle\n          [label]=\"'settings.interface.collapsibleMenu' | translate\"\n          [onText]=\"'interface.on' | translate\"\n          [offText]=\"'interface.off' | translate\"\n          [disabled]=\"updatingUserSettings$ | async\"\n          [ngModel]=\"collapsibleWidescreenMenu$ | async\"\n          (ngModelChange)=\"setCollapsibleWidescreenMenu($event)\"\n        >\n        </cds-toggle>\n      </cds-list-column>\n    </cds-list-row>\n\n    <cds-list-row *ngIf=\"allowUserThemeSwitching\">\n      <cds-list-column>\n        <cds-dropdown\n          [label]=\"'settings.interface.themePreference' | translate\"\n          [attr.data-test-id]=\"testIds.themeDropdown\"\n          [appendInline]=\"true\"\n          (click)=\"$event.stopPropagation()\"\n          (selected)=\"setPreferredTheme($event)\"\n          [dropUp]=\"false\"\n        >\n          <cds-dropdown-list [items]=\"(themeOptions$ | async) || []\"></cds-dropdown-list>\n        </cds-dropdown>\n      </cds-list-column>\n    </cds-list-row>\n\n    <cds-list-row *ngIf=\"enableCompactModeToggle\">\n      <cds-list-column>\n        <cds-toggle\n          [label]=\"'settings.interface.compactMode' | translate\"\n          [onText]=\"'interface.on' | translate\"\n          [offText]=\"'interface.off' | translate\"\n          [disabled]=\"updatingUserSettings$ | async\"\n          [ngModel]=\"compactMode$ | async\"\n          (ngModelChange)=\"setCompactMode($event)\"\n        >\n        </cds-toggle>\n      </cds-list-column>\n    </cds-list-row>\n\n    <cds-list-row *ngIf=\"enableShowUserNameToggle\">\n      <cds-list-column>\n        <cds-toggle\n          [label]=\"'settings.interface.showUserName' | translate\"\n          [onText]=\"'interface.on' | translate\"\n          [offText]=\"'interface.off' | translate\"\n          [disabled]=\"updatingUserSettings$ | async\"\n          [ngModel]=\"showUserNameInTopBar$ | async\"\n          (ngModelChange)=\"setShowUserName($event)\"\n        >\n        </cds-toggle>\n      </cds-list-column>\n    </cds-list-row>\n  </cds-structured-list>\n</ng-template>\n\n<ng-template #versionTemplate>\n  <ng-container *ngIf=\"{backendVersion: backendVersion$ | async} as obs\">\n    <cds-structured-list *ngIf=\"obs.backendVersion || frontendVersion\">\n      <cds-list-header>\n        <cds-list-column>{{ 'settings.version.title' | translate }}</cds-list-column>\n      </cds-list-header>\n\n      <cds-list-row *ngIf=\"obs.backendVersion\">\n        <cds-list-column>\n          <div class=\"build-information\">\n            <span class=\"build-title\">{{\n              'interface.builds.' + obs.backendVersion.title | translate\n            }}</span>\n            <div class=\"tag-container\">\n              <cds-tag type=\"blue\">{{ obs.backendVersion.version }}</cds-tag>\n            </div>\n          </div>\n        </cds-list-column>\n      </cds-list-row>\n\n      <cds-list-row *ngIf=\"frontendVersion\">\n        <cds-list-column>\n          <div class=\"build-information\">\n            <span class=\"build-title\">{{\n              'interface.builds.valtimo-frontend-libraries' | translate\n            }}</span>\n            <div class=\"tag-container\">\n              <cds-tag type=\"blue\">{{ frontendVersion }}</cds-tag>\n            </div>\n          </div>\n        </cds-list-column>\n      </cds-list-row>\n    </cds-structured-list>\n  </ng-container>\n</ng-template>\n\n<ng-template #feedbackMailTo>\n  <cds-list-column>\n    <a\n      [href]=\"\n        'mailto:' +\n        overrideFeedbackMenuItemToMailTo.email +\n        '?subject=' +\n        (overrideFeedbackMenuItemToMailTo.subjectTranslationKey | translate) +\n        '&body=' +\n        (overrideFeedbackMenuItemToMailTo.bodyTranslationKey | translate)\n      \"\n      target=\"_blank\"\n      cdsLink\n    >\n      {{ 'account.links.feedback' | translate }}\n    </a>\n  </cds-list-column>\n</ng-template>\n", styles: [".be-scroller-settings{padding-bottom:150px!important}.version-holder{position:fixed;bottom:0;width:259px;background-color:#f8f9fa}.info-text{line-height:1em!important;padding-right:70px;margin-bottom:15px}.right-sidebar-menu .cds--tab--list{width:100%}.right-sidebar-menu .menu-tabs .cds--tabs--scrollable__nav-item{width:12rem}.right-sidebar-menu .menu-tabs .cds--tabs--scrollable__nav-item button{width:100%}.right-sidebar-menu .menu-tabs .cds--tab--overflow-nav-button{display:none}.right-sidebar-menu .cds--header-panel{width:20rem;height:calc(100% - 3rem);transition:transform .11s cubic-bezier(.2,0,1,.9);transform:translate(100%)}.right-sidebar-menu .cds--header-panel--expanded{transform:translate(0)}.right-sidebar-menu .cds--panel--overlay{padding-top:0}.right-sidebar-menu .cds--tab-content{padding:0;outline:0}.right-sidebar-menu .cds--structured-list-td{padding-left:1rem;padding-right:1rem}.right-sidebar-menu .toggle-group{display:flex;flex-direction:column}.right-sidebar-menu .toggle-group .description{margin-top:1rem}.right-sidebar-menu cds-structured-list:last-child .cds--structured-list-row:last-child{border-bottom:0}.right-sidebar-menu .cds--grid,.right-sidebar-menu .cds--row,.right-sidebar-menu .menu-tabs{height:100%}.right-sidebar-menu .cds--grid--condensed{padding-left:1rem;padding-right:1rem}.right-sidebar-menu .cds--tab--list--full-width{display:flex;flex-direction:column;height:100%}.right-sidebar-menu cds-tab{overflow:auto}.right-sidebar-menu .build-information{display:inline-flex;flex-direction:column}.right-sidebar-menu .build-information:not(:last-child){margin-bottom:1rem}.right-sidebar-menu .build-information .tag-container .cds--tag{margin-left:0;margin-right:0;margin-bottom:0}.right-sidebar-menu .information-table cds-list-row:first-child{border-top:0}.right-sidebar-menu .information-table cds-list-row:first-child cds-list-column{border-top:0;padding-top:0}.right-sidebar-menu .information-table cds-list-row:last-child cds-list-column{padding-bottom:0}.right-sidebar-menu .information-table cds-list-row cds-list-column:first-child{padding-left:0!important}.account-information .cds--structured-list-td{display:inline-flex;flex-direction:column;border:none;min-width:100%}.account-information .cds--structured-list-td .cds--tag{margin:0;margin-top:.25rem;width:fit-content}.cds--select-input{background-color:var(--cds-field-02)}\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: i1.TranslateService }, { type: i6.UserProviderService }, { type: i2.FormBuilder }, { type: VersionService }, { type: ShellService }, { type: i0.ElementRef }, { type: i1$2.ConfigService }, { type: i1$2.UserSettingsService }, { type: PageHeaderService }, { type: CdsThemeService }], propDecorators: { onPageClick: [{
+            args: [{ selector: 'valtimo-right-sidebar', encapsulation: ViewEncapsulation.None, 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 class=\"right-sidebar-menu\">\n  <cds-panel [expanded]=\"panelExpanded$ | async\">\n    <div cdsGrid [condensed]=\"true\">\n      <div cdsRow>\n        <div cdsCol [columnNumbers]=\"{lg: 16}\" class=\"menu-tabs\" cdsLayer>\n          <cds-tabs class=\"cds--tab--list--full-width\">\n            <cds-tab [heading]=\"'account.title' | translate\">\n              <ng-container *ngTemplateOutlet=\"accountTabTemplate\"></ng-container>\n            </cds-tab>\n\n            <cds-tab [heading]=\"'settings.title' | translate\" [attr.data-test-id]=\"testIds.settingsTab\">\n              <ng-container *ngTemplateOutlet=\"settingsTabTemplate\"></ng-container>\n            </cds-tab>\n          </cds-tabs>\n        </div>\n      </div>\n    </div>\n  </cds-panel>\n</div>\n\n<ng-template #accountTabTemplate>\n  <ng-container *ngTemplateOutlet=\"accountInformationTemplate\"></ng-container>\n\n  <ng-container *ngTemplateOutlet=\"linksTemplate\"></ng-container>\n</ng-template>\n\n<ng-template #settingsTabTemplate>\n  <ng-container *ngTemplateOutlet=\"languageSettingsTemplate\"></ng-container>\n\n  <ng-container *ngTemplateOutlet=\"interfaceSettingsTemplate\"></ng-container>\n\n  @if (showValtimoVersions) {\n    <ng-container *ngTemplateOutlet=\"versionTemplate\"></ng-container>\n  }\n</ng-template>\n\n<ng-template #accountInformationTemplate>\n  <cds-structured-list>\n    <cds-list-header>\n      <cds-list-column>{{ 'account.informationTitle' | translate }}</cds-list-column>\n    </cds-list-header>\n\n    <cds-list-row>\n      <cds-list-column>\n        <ng-container *ngTemplateOutlet=\"accountInformationTableTemplate\"></ng-container>\n      </cds-list-column>\n    </cds-list-row>\n  </cds-structured-list>\n</ng-template>\n\n<ng-template #accountInformationTableTemplate>\n  <div class=\"information-table account-information\">\n    <cds-structured-list *ngIf=\"userSubject$ | async as userSubject\">\n      <cds-list-row>\n        <cds-list-column\n          >{{ 'interface.email' | translate }}\n          <cds-tag type=\"blue\">{{ userSubject.email }}</cds-tag>\n        </cds-list-column>\n      </cds-list-row>\n\n      <cds-list-row>\n        <cds-list-column\n          >{{ 'interface.username' | translate }}\n          <cds-tag type=\"blue\">{{ userSubject.username }}</cds-tag>\n        </cds-list-column>\n      </cds-list-row>\n\n      <cds-list-row>\n        <cds-list-column\n          >{{ 'interface.name' | translate }}\n          <cds-tag type=\"blue\">{{ userSubject.firstName + ' ' + userSubject.lastName }}</cds-tag>\n        </cds-list-column>\n      </cds-list-row>\n    </cds-structured-list>\n  </div>\n</ng-template>\n\n<ng-template #linksTemplate>\n  <cds-structured-list>\n    <cds-list-header>\n      <cds-list-column>{{ 'account.quickLinks' | translate }}</cds-list-column>\n    </cds-list-header>\n\n    <cds-list-row>\n      <cds-list-column>\n        <ng-container *ngTemplateOutlet=\"linksTableTemplate\"></ng-container>\n      </cds-list-column>\n    </cds-list-row>\n  </cds-structured-list>\n</ng-template>\n\n<ng-template #linksTableTemplate>\n  <div class=\"information-table\">\n    <cds-structured-list>\n      <cds-list-row>\n        <cds-list-column>\n          <a href=\"https://docs.valtimo.nl\" target=\"_blank\" cdsLink>{{\n            'account.links.help' | translate\n          }}</a>\n        </cds-list-column>\n      </cds-list-row>\n\n      <cds-list-row>\n        <cds-list-column *ngIf=\"!overrideFeedbackMenuItemToMailTo; else feedbackMailTo\">\n          <a href=\"https://www.valtimo.nl/feedback\" target=\"_blank\" cdsLink>{{\n            'account.links.feedback' | translate\n          }}</a>\n        </cds-list-column>\n      </cds-list-row>\n\n      <cds-list-row *ngIf=\"resetUrl\">\n        <cds-list-column>\n          <a [href]=\"resetUrl\" cdsLink>{{ 'account.links.resetPassword' | translate }}</a>\n        </cds-list-column>\n      </cds-list-row>\n\n      <cds-list-row>\n        <cds-list-column>\n          <a href=\"javascript:void(0)\" cdsLink (click)=\"logout()\">{{\n            'account.links.signOut' | translate\n          }}</a>\n        </cds-list-column>\n      </cds-list-row>\n\n      <cds-list-row *ngIf=\"showPlantATreeButton$ | async\">\n        <cds-list-column>\n          <a\n            class=\"text-success\"\n            href=\"mailto:valtimo@ritense.com?subject=Plant een boom voor Valtimo&body=Hallo Valtimo gebruiker,%0D%0DMet het versturen van deze e-mail gaan we gelijk aan de slag om een boom te planten. Hiermee compenseren we voor een deel de CO2 uitstoot van je Valtimo gebruik.%0D%0DMet Groene Groet,%0D%0DHet Valtimo team%0D%0D*Deze bomenplantactie kan 1 keer ingezet worden door elke geregistreerde Valtimo gebruiker.%0D%0D** Ritense plant ook jaarlijks bomen voor alle Valtimo installaties die in gebruik zijn.\"\n            target=\"_blank\"\n            cdsLink\n          >\n            {{ 'account.links.plantATree' | translate }}\n          </a>\n        </cds-list-column>\n      </cds-list-row>\n    </cds-structured-list>\n  </div>\n</ng-template>\n\n<ng-template #languageSettingsTemplate>\n  <cds-structured-list>\n    <cds-list-header>\n      <cds-list-column>{{ 'settings.language.title' | translate }}</cds-list-column>\n    </cds-list-header>\n\n    <cds-list-row>\n      <cds-list-column>\n        <cds-dropdown\n          [id]=\"'language-dropdown'\"\n          [attr.data-test-id]=\"testIds.languageDropdown\"\n          [appendInline]=\"true\"\n          [dropUp]=\"false\"\n          (click)=\"$event.stopPropagation()\"\n          (selected)=\"updateUserLanguage($event)\"\n        >\n          <cds-dropdown-list [items]=\"(languageListItems$ | async) || []\"></cds-dropdown-list>\n        </cds-dropdown>\n      </cds-list-column>\n    </cds-list-row>\n  </cds-structured-list>\n</ng-template>\n\n<ng-template #interfaceSettingsTemplate>\n  <cds-structured-list>\n    <cds-list-header>\n      <cds-list-column>{{ 'settings.interface.title' | translate }}</cds-list-column>\n    </cds-list-header>\n\n    <cds-list-row>\n      <cds-list-column>\n        <cds-toggle\n          [label]=\"'settings.interface.collapsibleMenu' | translate\"\n          [onText]=\"'interface.on' | translate\"\n          [offText]=\"'interface.off' | translate\"\n          [disabled]=\"updatingUserSettings$ | async\"\n          [ngModel]=\"collapsibleWidescreenMenu$ | async\"\n          (ngModelChange)=\"setCollapsibleWidescreenMenu($event)\"\n        >\n        </cds-toggle>\n      </cds-list-column>\n    </cds-list-row>\n\n    <cds-list-row *ngIf=\"allowUserThemeSwitching$ | async\">\n      <cds-list-column>\n        <cds-dropdown\n          [label]=\"'settings.interface.themePreference' | translate\"\n          [attr.data-test-id]=\"testIds.themeDropdown\"\n          [appendInline]=\"true\"\n          (click)=\"$event.stopPropagation()\"\n          (selected)=\"setPreferredTheme($event)\"\n          [dropUp]=\"false\"\n        >\n          <cds-dropdown-list [items]=\"(themeOptions$ | async) || []\"></cds-dropdown-list>\n        </cds-dropdown>\n      </cds-list-column>\n    </cds-list-row>\n\n    <cds-list-row *ngIf=\"enableCompactModeToggle$ | async\">\n      <cds-list-column>\n        <cds-toggle\n          [label]=\"'settings.interface.compactMode' | translate\"\n          [onText]=\"'interface.on' | translate\"\n          [offText]=\"'interface.off' | translate\"\n          [disabled]=\"updatingUserSettings$ | async\"\n          [ngModel]=\"compactMode$ | async\"\n          (ngModelChange)=\"setCompactMode($event)\"\n        >\n        </cds-toggle>\n      </cds-list-column>\n    </cds-list-row>\n\n    <cds-list-row *ngIf=\"enableShowUserNameToggle$ | async\">\n      <cds-list-column>\n        <cds-toggle\n          [label]=\"'settings.interface.showUserName' | translate\"\n          [onText]=\"'interface.on' | translate\"\n          [offText]=\"'interface.off' | translate\"\n          [disabled]=\"updatingUserSettings$ | async\"\n          [ngModel]=\"showUserNameInTopBar$ | async\"\n          (ngModelChange)=\"setShowUserName($event)\"\n        >\n        </cds-toggle>\n      </cds-list-column>\n    </cds-list-row>\n  </cds-structured-list>\n</ng-template>\n\n<ng-template #versionTemplate>\n  <ng-container *ngIf=\"{backendVersion: backendVersion$ | async} as obs\">\n    <cds-structured-list *ngIf=\"obs.backendVersion || frontendVersion\">\n      <cds-list-header>\n        <cds-list-column>{{ 'settings.version.title' | translate }}</cds-list-column>\n      </cds-list-header>\n\n      <cds-list-row *ngIf=\"obs.backendVersion\">\n        <cds-list-column>\n          <div class=\"build-information\">\n            <span class=\"build-title\">{{\n              'interface.builds.' + obs.backendVersion.title | translate\n            }}</span>\n            <div class=\"tag-container\">\n              <cds-tag type=\"blue\">{{ obs.backendVersion.version }}</cds-tag>\n            </div>\n          </div>\n        </cds-list-column>\n      </cds-list-row>\n\n      <cds-list-row *ngIf=\"frontendVersion\">\n        <cds-list-column>\n          <div class=\"build-information\">\n            <span class=\"build-title\">{{\n              'interface.builds.valtimo-frontend-libraries' | translate\n            }}</span>\n            <div class=\"tag-container\">\n              <cds-tag type=\"blue\">{{ frontendVersion }}</cds-tag>\n            </div>\n          </div>\n        </cds-list-column>\n      </cds-list-row>\n    </cds-structured-list>\n  </ng-container>\n</ng-template>\n\n<ng-template #feedbackMailTo>\n  <cds-list-column>\n    <a\n      [href]=\"\n        'mailto:' +\n        overrideFeedbackMenuItemToMailTo.email +\n        '?subject=' +\n        (overrideFeedbackMenuItemToMailTo.subjectTranslationKey | translate) +\n        '&body=' +\n        (overrideFeedbackMenuItemToMailTo.bodyTranslationKey | translate)\n      \"\n      target=\"_blank\"\n      cdsLink\n    >\n      {{ 'account.links.feedback' | translate }}\n    </a>\n  </cds-list-column>\n</ng-template>\n", styles: [".be-scroller-settings{padding-bottom:150px!important}.version-holder{position:fixed;bottom:0;width:259px;background-color:#f8f9fa}.info-text{line-height:1em!important;padding-right:70px;margin-bottom:15px}.right-sidebar-menu .cds--tab--list{width:100%}.right-sidebar-menu .menu-tabs .cds--tabs--scrollable__nav-item{width:12rem}.right-sidebar-menu .menu-tabs .cds--tabs--scrollable__nav-item button{width:100%}.right-sidebar-menu .menu-tabs .cds--tab--overflow-nav-button{display:none}.right-sidebar-menu .cds--header-panel{width:20rem;height:calc(100% - 3rem);transition:transform .11s cubic-bezier(.2,0,1,.9);transform:translate(100%)}.right-sidebar-menu .cds--header-panel--expanded{transform:translate(0)}.right-sidebar-menu .cds--panel--overlay{padding-top:0}.right-sidebar-menu .cds--tab-content{padding:0;outline:0}.right-sidebar-menu .cds--structured-list-td{padding-left:1rem;padding-right:1rem}.right-sidebar-menu .toggle-group{display:flex;flex-direction:column}.right-sidebar-menu .toggle-group .description{margin-top:1rem}.right-sidebar-menu cds-structured-list:last-child .cds--structured-list-row:last-child{border-bottom:0}.right-sidebar-menu .cds--grid,.right-sidebar-menu .cds--row,.right-sidebar-menu .menu-tabs{height:100%}.right-sidebar-menu .cds--grid--condensed{padding-left:1rem;padding-right:1rem}.right-sidebar-menu .cds--tab--list--full-width{display:flex;flex-direction:column;height:100%}.right-sidebar-menu cds-tab{overflow:auto}.right-sidebar-menu .build-information{display:inline-flex;flex-direction:column}.right-sidebar-menu .build-information:not(:last-child){margin-bottom:1rem}.right-sidebar-menu .build-information .tag-container .cds--tag{margin-left:0;margin-right:0;margin-bottom:0}.right-sidebar-menu .information-table cds-list-row:first-child{border-top:0}.right-sidebar-menu .information-table cds-list-row:first-child cds-list-column{border-top:0;padding-top:0}.right-sidebar-menu .information-table cds-list-row:last-child cds-list-column{padding-bottom:0}.right-sidebar-menu .information-table cds-list-row cds-list-column:first-child{padding-left:0!important}.account-information .cds--structured-list-td{display:inline-flex;flex-direction:column;border:none;min-width:100%}.account-information .cds--structured-list-td .cds--tag{margin:0;margin-top:.25rem;width:fit-content}.cds--select-input{background-color:var(--cds-field-02)}\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: i1.TranslateService }, { type: i6$1.UserProviderService }, { type: i2.FormBuilder }, { type: VersionService }, { type: ShellService }, { type: i0.ElementRef }, { type: i1$2.ConfigService }, { type: i1$2.UserSettingsService }, { type: PageHeaderService }, { type: CdsThemeService }], propDecorators: { onPageClick: [{
                 type: HostListener,
                 args: ['document:click', ['$event.target']]
             }] } });
@@ -5068,11 +5225,11 @@ class LeftSidebarComponent {
         });
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.20", 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.20", 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        <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                [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      </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$2.SideNav, selector: "cds-sidenav, ibm-sidenav", inputs: ["ariaLabel", "expanded", "hidden", "rail", "allowExpansion", "navigationItems", "useRouter"] }, { kind: "component", type: i2$2.SideNavItem, selector: "cds-sidenav-item, ibm-sidenav-item", inputs: ["href", "useRouter", "active", "route", "isSubMenu", "routeExtras", "title"], outputs: ["navigation", "selected"] }, { kind: "component", type: i2$2.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$2.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.20", 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                  [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.20", 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        <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                [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      </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\">\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                  [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']
@@ -5114,9 +5271,9 @@ class PageTitleComponent {
         this.customPageTitleSet$ = this.pageTitleService.customPageTitleSet$;
         this.translatedTitle$ = new BehaviorSubject('');
         this.smallTitle$ = this.pageHeaderService.smallTitle$;
-        this.appTitleAsSuffix = this.configService?.config?.featureToggles?.applicationTitleAsSuffix || false;
+        this._appTitleAsSuffix$ = this.configService.getFeatureToggleObservable('applicationTitleAsSuffix');
         this._subscriptions = new Subscription();
-        this._hidePageTitle$ = this.router.events.pipe(startWith(this.router), switchMap(() => this.activatedRoute.firstChild.data), map(data => !!data?.hidePageTitle), tap$1(hidden => this.pageTitleService.setPageTitleHidden(hidden)));
+        this._hidePageTitle$ = this.router.events.pipe(startWith(this.router), switchMap(() => this.activatedRoute.firstChild.data), map(data => !!data?.hidePageTitle), tap(hidden => this.pageTitleService.setPageTitleHidden(hidden)));
     }
     ngOnInit() {
         this.openRouterTranslateSubscription();
@@ -5133,7 +5290,8 @@ class PageTitleComponent {
         this._subscriptions.add(combineLatest([
             this.router.events.pipe(startWith(null)),
             this.translateService.stream('key'),
-        ]).subscribe(() => {
+            this._appTitleAsSuffix$,
+        ]).subscribe(([, , appTitleAsSuffix]) => {
             const routeTitle = this.activatedRoute?.snapshot?.firstChild?.data?.title ||
                 this.activatedRoute?.snapshot?.firstChild?.children[0]?.data?.title;
             const routeTitleTranslation = this.translateService.instant(routeTitle);
@@ -5148,7 +5306,7 @@ class PageTitleComponent {
             if (translatedRouteTitle) {
                 this.logger.debug('PageTitle: setTitle translated async', translatedRouteTitle);
                 this.translatedTitle$.next(translatedRouteTitle);
-                if (this.appTitleAsSuffix) {
+                if (appTitleAsSuffix) {
                     this.titleService.setTitle(translatedRouteTitle + ' - ' + this.appTitle);
                 }
                 else {
@@ -5172,13 +5330,13 @@ class PageTitleComponent {
             this.isCompact = compactMode;
         }));
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.20", ngImport: i0, type: PageTitleComponent, deps: [{ token: i1$3.Router }, { token: i1$3.ActivatedRoute }, { token: i5.Title }, { token: i1.TranslateService }, { token: i4.NGXLogger }, { token: i1$2.ConfigService }, { token: PageTitleService }, { token: PageHeaderService }, { token: PageSubtitleService }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.20", type: PageTitleComponent, isStandalone: false, selector: "valtimo-page-title", host: { properties: { "class.valtimo-page-title--compact": "this.isCompact" } }, viewQueries: [{ propertyName: "_subtitleVcr", first: true, predicate: ["subtitleVcr"], descendants: true, read: ViewContainerRef, static: 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=\"page-title-container\"\n  [ngClass]=\"{\n    'page-title-container--no-margin': hidePageTitle || isCompact,\n    'page-title-container--compact': isCompact,\n  }\"\n>\n  <ng-container\n    *ngIf=\"\n      hidePageTitle === false && {\n        title: translatedTitle$ | async,\n        hasCustomPageTitle: hasCustomPageTitle$ | async,\n        customPageTitle: customPageTitle$ | async,\n        customPageTitleSet: customPageTitleSet$ | async,\n      } as obs\n    \"\n  >\n    <div\n      class=\"skeleton-container\"\n      *ngIf=\"obs.hasCustomPageTitle && !obs.customPageTitleSet\"\n      [ngClass]=\"{'skeleton-container--compact': isCompact}\"\n    >\n      <cds-skeleton-placeholder></cds-skeleton-placeholder>\n    </div>\n\n    <ng-container *ngIf=\"obs.hasCustomPageTitle ? obs.customPageTitleSet : obs.title !== ''\">\n      @if (!isCompact) {\n        <h2\n          [title]=\"obs.hasCustomPageTitle ? obs.customPageTitle : obs.title\"\n          class=\"page-title\"\n          [ngClass]=\"{'page-title--small-title': smallTitle$ | async}\"\n        >\n          {{ obs.hasCustomPageTitle ? obs.customPageTitle : obs.title }}\n        </h2>\n      } @else {\n        <span\n          [title]=\"obs.hasCustomPageTitle ? obs.customPageTitle : obs.title\"\n          class=\"cds--breadcrumb compact-page-title\"\n        >\n          {{ obs.hasCustomPageTitle ? obs.customPageTitle : obs.title }}\n        </span>\n      }\n    </ng-container>\n  </ng-container>\n\n  <ng-container #subtitleVcr></ng-container>\n</div>\n", styles: [".page-title-container{display:flex;flex-direction:row;align-items:flex-end}.page-title-container--no-margin{margin-bottom:0}.page-title-container--compact{align-items:center}.page-title-container .page-title{flex-shrink:0;font-weight:300;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.page-title-container .page-title--small-title{font-size:var(--cds-body-compact-01-font-size, .875rem);font-weight:var(--cds-body-compact-01-font-weight, 400);line-height:var(--cds-body-compact-01-line-height, 1.28572);letter-spacing:var(--cds-body-compact-01-letter-spacing, .16px)}.page-title-container .compact-page-title{margin-left:8px;flex-shrink:0}.page-title-container .skeleton-container .cds--skeleton__placeholder{width:200px;height:40px}.page-title-container .skeleton-container--compact{width:60px;height:18px;overflow:hidden;margin-left:8px}.valtimo-page-title--compact{width:100%}\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.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i2$2.SkeletonPlaceholder, selector: "cds-skeleton-placeholder, ibm-skeleton-placeholder" }, { kind: "pipe", type: i1$4.AsyncPipe, name: "async" }], encapsulation: i0.ViewEncapsulation.None }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.20", ngImport: i0, type: PageTitleComponent, deps: [{ token: i1$3.Router }, { token: i1$3.ActivatedRoute }, { token: i6.Title }, { token: i1.TranslateService }, { token: i4.NGXLogger }, { token: i1$2.ConfigService }, { token: PageTitleService }, { token: PageHeaderService }, { token: PageSubtitleService }], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.20", type: PageTitleComponent, isStandalone: false, selector: "valtimo-page-title", host: { properties: { "class.valtimo-page-title--compact": "this.isCompact" } }, viewQueries: [{ propertyName: "_subtitleVcr", first: true, predicate: ["subtitleVcr"], descendants: true, read: ViewContainerRef, static: 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=\"page-title-container\"\n  [ngClass]=\"{\n    'page-title-container--no-margin': hidePageTitle || isCompact,\n    'page-title-container--compact': isCompact,\n  }\"\n>\n  <ng-container\n    *ngIf=\"\n      hidePageTitle === false && {\n        title: translatedTitle$ | async,\n        hasCustomPageTitle: hasCustomPageTitle$ | async,\n        customPageTitle: customPageTitle$ | async,\n        customPageTitleSet: customPageTitleSet$ | async,\n      } as obs\n    \"\n  >\n    <div\n      class=\"skeleton-container\"\n      *ngIf=\"obs.hasCustomPageTitle && !obs.customPageTitleSet\"\n      [ngClass]=\"{'skeleton-container--compact': isCompact}\"\n    >\n      <cds-skeleton-placeholder></cds-skeleton-placeholder>\n    </div>\n\n    <ng-container *ngIf=\"obs.hasCustomPageTitle ? obs.customPageTitleSet : obs.title !== ''\">\n      @if (!isCompact) {\n        <h2\n          [title]=\"obs.hasCustomPageTitle ? obs.customPageTitle : obs.title\"\n          class=\"page-title\"\n          [ngClass]=\"{'page-title--small-title': smallTitle$ | async}\"\n        >\n          {{ obs.hasCustomPageTitle ? obs.customPageTitle : obs.title }}\n        </h2>\n      } @else {\n        <span\n          [title]=\"obs.hasCustomPageTitle ? obs.customPageTitle : obs.title\"\n          class=\"cds--breadcrumb compact-page-title\"\n        >\n          {{ obs.hasCustomPageTitle ? obs.customPageTitle : obs.title }}\n        </span>\n      }\n    </ng-container>\n  </ng-container>\n\n  <ng-container #subtitleVcr></ng-container>\n</div>\n", styles: [".page-title-container{display:flex;flex-direction:row;align-items:flex-end}.page-title-container--no-margin{margin-bottom:0}.page-title-container--compact{align-items:center}.page-title-container .page-title{flex-shrink:0;font-weight:300;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.page-title-container .page-title--small-title{font-size:var(--cds-body-compact-01-font-size, .875rem);font-weight:var(--cds-body-compact-01-font-weight, 400);line-height:var(--cds-body-compact-01-line-height, 1.28572);letter-spacing:var(--cds-body-compact-01-letter-spacing, .16px)}.page-title-container .compact-page-title{margin-left:8px;flex-shrink:0}.page-title-container .skeleton-container .cds--skeleton__placeholder{width:200px;height:40px}.page-title-container .skeleton-container--compact{width:60px;height:18px;overflow:hidden;margin-left:8px}.valtimo-page-title--compact{width:100%}\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.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i2$3.SkeletonPlaceholder, selector: "cds-skeleton-placeholder, ibm-skeleton-placeholder" }, { kind: "pipe", type: i1$4.AsyncPipe, name: "async" }], encapsulation: i0.ViewEncapsulation.None }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.20", ngImport: i0, type: PageTitleComponent, decorators: [{
             type: Component,
             args: [{ selector: 'valtimo-page-title', encapsulation: ViewEncapsulation.None, 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=\"page-title-container\"\n  [ngClass]=\"{\n    'page-title-container--no-margin': hidePageTitle || isCompact,\n    'page-title-container--compact': isCompact,\n  }\"\n>\n  <ng-container\n    *ngIf=\"\n      hidePageTitle === false && {\n        title: translatedTitle$ | async,\n        hasCustomPageTitle: hasCustomPageTitle$ | async,\n        customPageTitle: customPageTitle$ | async,\n        customPageTitleSet: customPageTitleSet$ | async,\n      } as obs\n    \"\n  >\n    <div\n      class=\"skeleton-container\"\n      *ngIf=\"obs.hasCustomPageTitle && !obs.customPageTitleSet\"\n      [ngClass]=\"{'skeleton-container--compact': isCompact}\"\n    >\n      <cds-skeleton-placeholder></cds-skeleton-placeholder>\n    </div>\n\n    <ng-container *ngIf=\"obs.hasCustomPageTitle ? obs.customPageTitleSet : obs.title !== ''\">\n      @if (!isCompact) {\n        <h2\n          [title]=\"obs.hasCustomPageTitle ? obs.customPageTitle : obs.title\"\n          class=\"page-title\"\n          [ngClass]=\"{'page-title--small-title': smallTitle$ | async}\"\n        >\n          {{ obs.hasCustomPageTitle ? obs.customPageTitle : obs.title }}\n        </h2>\n      } @else {\n        <span\n          [title]=\"obs.hasCustomPageTitle ? obs.customPageTitle : obs.title\"\n          class=\"cds--breadcrumb compact-page-title\"\n        >\n          {{ obs.hasCustomPageTitle ? obs.customPageTitle : obs.title }}\n        </span>\n      }\n    </ng-container>\n  </ng-container>\n\n  <ng-container #subtitleVcr></ng-container>\n</div>\n", styles: [".page-title-container{display:flex;flex-direction:row;align-items:flex-end}.page-title-container--no-margin{margin-bottom:0}.page-title-container--compact{align-items:center}.page-title-container .page-title{flex-shrink:0;font-weight:300;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.page-title-container .page-title--small-title{font-size:var(--cds-body-compact-01-font-size, .875rem);font-weight:var(--cds-body-compact-01-font-weight, 400);line-height:var(--cds-body-compact-01-line-height, 1.28572);letter-spacing:var(--cds-body-compact-01-letter-spacing, .16px)}.page-title-container .compact-page-title{margin-left:8px;flex-shrink:0}.page-title-container .skeleton-container .cds--skeleton__placeholder{width:200px;height:40px}.page-title-container .skeleton-container--compact{width:60px;height:18px;overflow:hidden;margin-left:8px}.valtimo-page-title--compact{width:100%}\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: i1$3.Router }, { type: i1$3.ActivatedRoute }, { type: i5.Title }, { type: i1.TranslateService }, { type: i4.NGXLogger }, { type: i1$2.ConfigService }, { type: PageTitleService }, { type: PageHeaderService }, { type: PageSubtitleService }], propDecorators: { isCompact: [{
+        }], ctorParameters: () => [{ type: i1$3.Router }, { type: i1$3.ActivatedRoute }, { type: i6.Title }, { type: i1.TranslateService }, { type: i4.NGXLogger }, { type: i1$2.ConfigService }, { type: PageTitleService }, { type: PageHeaderService }, { type: PageSubtitleService }], propDecorators: { isCompact: [{
                 type: HostBinding,
                 args: ['class.valtimo-page-title--compact']
             }], _subtitleVcr: [{
@@ -6034,13 +6192,13 @@ class OverflowMenuTriggerComponent {
         this.compact = false;
         this._iconService.registerAll([OverflowMenuVertical16]);
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.20", ngImport: i0, type: OverflowMenuTriggerComponent, deps: [{ token: i2$2.IconService }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.20", type: OverflowMenuTriggerComponent, isStandalone: true, selector: "v-overflow-menu-trigger", inputs: { compact: "compact" }, 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<div class=\"v-overflow-menu-trigger\" [class.--compact]=\"compact\">\n  <svg cdsIcon=\"overflow-menu--vertical\" size=\"16\"></svg>\n</div>\n", styles: [".v-overflow-menu-trigger{display:flex;align-items:center;justify-content:center;width:2.5rem;height:2.5rem;color:var(--cds-icon-primary)}.v-overflow-menu-trigger:hover{background-color:var(--cds-layer-active)}.v-overflow-menu-trigger.--compact{width:2rem;height:2rem;min-height:2rem}\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: "ngmodule", type: IconModule }, { kind: "directive", type: i2$2.IconDirective, selector: "[cdsIcon], [ibmIcon]", inputs: ["ibmIcon", "cdsIcon", "size", "title", "ariaLabel", "ariaLabelledBy", "ariaHidden", "isFocusable"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.20", ngImport: i0, type: OverflowMenuTriggerComponent, deps: [{ token: i2$3.IconService }], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.20", type: OverflowMenuTriggerComponent, isStandalone: true, selector: "v-overflow-menu-trigger", inputs: { compact: "compact" }, 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<div class=\"v-overflow-menu-trigger\" [class.--compact]=\"compact\">\n  <svg cdsIcon=\"overflow-menu--vertical\" size=\"16\"></svg>\n</div>\n", styles: [".v-overflow-menu-trigger{display:flex;align-items:center;justify-content:center;width:2.5rem;height:2.5rem;color:var(--cds-icon-primary)}.v-overflow-menu-trigger:hover{background-color:var(--cds-layer-active)}.v-overflow-menu-trigger.--compact{width:2rem;height:2rem;min-height:2rem}\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: "ngmodule", type: IconModule }, { kind: "directive", type: i2$3.IconDirective, selector: "[cdsIcon], [ibmIcon]", inputs: ["ibmIcon", "cdsIcon", "size", "title", "ariaLabel", "ariaLabelledBy", "ariaHidden", "isFocusable"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.20", ngImport: i0, type: OverflowMenuTriggerComponent, decorators: [{
             type: Component,
             args: [{ selector: 'v-overflow-menu-trigger', changeDetection: ChangeDetectionStrategy.OnPush, standalone: true, imports: [IconModule], 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<div class=\"v-overflow-menu-trigger\" [class.--compact]=\"compact\">\n  <svg cdsIcon=\"overflow-menu--vertical\" size=\"16\"></svg>\n</div>\n", styles: [".v-overflow-menu-trigger{display:flex;align-items:center;justify-content:center;width:2.5rem;height:2.5rem;color:var(--cds-icon-primary)}.v-overflow-menu-trigger:hover{background-color:var(--cds-layer-active)}.v-overflow-menu-trigger.--compact{width:2rem;height:2rem;min-height:2rem}\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: i2$2.IconService }], propDecorators: { compact: [{
+        }], ctorParameters: () => [{ type: i2$3.IconService }], propDecorators: { compact: [{
                 type: Input
             }] } });
 
@@ -6185,7 +6343,7 @@ class CarbonTagsModalComponent {
         this.closeEvent.emit();
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.20", ngImport: i0, type: CarbonTagsModalComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.20", type: CarbonTagsModalComponent, isStandalone: false, selector: "valtimo-tags-modal", inputs: { open: "open", tags: "tags" }, outputs: { closeEvent: "closeEvent" }, 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-modal\n  valtimoCdsModal\n  [title]=\"'interface.tags' | translate\"\n  size=\"xs\"\n  [open]=\"open\"\n  (close)=\"onCloseSelect()\"\n>\n  <cds-modal-header [showCloseButton]=\"true\" (closeSelect)=\"onCloseSelect()\">\n    <h3 cdsModalHeading>{{ 'interface.tags' | translate }}</h3>\n  </cds-modal-header>\n\n  <section cdsModalContent class=\"valtimo-tags-modal__content\">\n    <div class=\"valtimo-tags-modal__container\">\n      @for (tag of tags; track tag.content) {\n        <cds-tag [type]=\"tag.type\">\n          {{ tag.content }}\n        </cds-tag>\n      }\n    </div>\n  </section>\n</cds-modal>\n", styles: [".valtimo-tags-modal__content{max-height:300px}.valtimo-tags-modal__container{width:100%;max-height:100%;overflow:auto;background:var(--cds-layer-02);padding:16px;border-radius:8px}.valtimo-tags-modal__container>*:first-child{margin-left:0!important}\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: "component", type: i2$2.Tag, selector: "cds-tag, ibm-tag", inputs: ["type", "size", "class", "skeleton"] }, { kind: "component", type: i2$2.Modal, selector: "cds-modal, ibm-modal", inputs: ["size", "theme", "ariaLabel", "open", "trigger", "hasScrollingContent"], outputs: ["overlaySelected", "close"] }, { kind: "component", type: i2$2.ModalHeader, selector: "cds-modal-header, ibm-modal-header", inputs: ["theme", "closeLabel", "showCloseButton"], outputs: ["closeSelect"] }, { kind: "directive", type: i2$2.ModalContent, selector: "[cdsModalContent], [ibmModalContent]", inputs: ["hasForm"] }, { kind: "directive", type: ValtimoCdsModalDirective, selector: "[valtimoCdsModal]", inputs: ["minContentHeight"] }, { kind: "pipe", type: i1.TranslatePipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.20", type: CarbonTagsModalComponent, isStandalone: false, selector: "valtimo-tags-modal", inputs: { open: "open", tags: "tags" }, outputs: { closeEvent: "closeEvent" }, 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-modal\n  valtimoCdsModal\n  [title]=\"'interface.tags' | translate\"\n  size=\"xs\"\n  [open]=\"open\"\n  (close)=\"onCloseSelect()\"\n>\n  <cds-modal-header [showCloseButton]=\"true\" (closeSelect)=\"onCloseSelect()\">\n    <h3 cdsModalHeading>{{ 'interface.tags' | translate }}</h3>\n  </cds-modal-header>\n\n  <section cdsModalContent class=\"valtimo-tags-modal__content\">\n    <div class=\"valtimo-tags-modal__container\">\n      @for (tag of tags; track tag.content) {\n        <cds-tag [type]=\"tag.type\">\n          {{ tag.content }}\n        </cds-tag>\n      }\n    </div>\n  </section>\n</cds-modal>\n", styles: [".valtimo-tags-modal__content{max-height:300px}.valtimo-tags-modal__container{width:100%;max-height:100%;overflow:auto;background:var(--cds-layer-02);padding:16px;border-radius:8px}.valtimo-tags-modal__container>*:first-child{margin-left:0!important}\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: "component", type: i2$3.Tag, selector: "cds-tag, ibm-tag", inputs: ["type", "size", "class", "skeleton"] }, { kind: "component", type: i2$3.Modal, selector: "cds-modal, ibm-modal", inputs: ["size", "theme", "ariaLabel", "open", "trigger", "hasScrollingContent"], outputs: ["overlaySelected", "close"] }, { kind: "component", type: i2$3.ModalHeader, selector: "cds-modal-header, ibm-modal-header", inputs: ["theme", "closeLabel", "showCloseButton"], outputs: ["closeSelect"] }, { kind: "directive", type: i2$3.ModalContent, selector: "[cdsModalContent], [ibmModalContent]", inputs: ["hasForm"] }, { kind: "directive", type: ValtimoCdsModalDirective, selector: "[valtimoCdsModal]", inputs: ["minContentHeight"] }, { kind: "pipe", type: i1.TranslatePipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.20", ngImport: i0, type: CarbonTagsModalComponent, decorators: [{
             type: Component,
@@ -6433,7 +6591,7 @@ class CarbonListComponent {
                 }
             }),
             ...this.getExtraItems(item, index, items.length),
-        ])), tap((data) => {
+        ])), tap$1((data) => {
             this._completeDataSource = data;
         }));
         this._filteredItems$ = new BehaviorSubject(null);
@@ -6677,6 +6835,9 @@ class CarbonListComponent {
         ];
     }
     loadPaginationSize() {
+        if (!this.paginationIdentifier) {
+            return;
+        }
         const entries = localStorage.getItem(`${this.paginationIdentifier}${CarbonListComponent.PAGINATION_SIZE}`);
         if (entries !== null) {
             this.pagination = { size: +entries };
@@ -6689,8 +6850,10 @@ class CarbonListComponent {
         }
     }
     setPaginationSize(numberOfEntries) {
-        localStorage.setItem(`${this.paginationIdentifier}${CarbonListComponent.PAGINATION_SIZE}`, numberOfEntries);
-        this.logger.debug('Pagination set in local storage for this list: ', numberOfEntries);
+        if (this.paginationIdentifier) {
+            localStorage.setItem(`${this.paginationIdentifier}${CarbonListComponent.PAGINATION_SIZE}`, numberOfEntries);
+            this.logger.debug('Pagination set in local storage for this list: ', numberOfEntries);
+        }
         this.paginationSet.emit(numberOfEntries);
     }
     resolveObject(definition, obj) {
@@ -6728,13 +6891,13 @@ class CarbonListComponent {
             type: 'blue',
         }));
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.20", ngImport: i0, type: CarbonListComponent, deps: [{ token: EllipsisPipe }, { token: CarbonListFilterPipe }, { token: i2$2.IconService }, { token: i4.NGXLogger }, { token: i1.TranslateService }, { token: ViewContentService }, { token: KeyStateService }, { token: CarbonListDragAndDropService }, { token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.20", 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", enableSingleSelection: "enableSingleSelection", lastColumnTemplate: "lastColumnTemplate", paginationIdentifier: "paginationIdentifier", showSelectionColumn: "showSelectionColumn", striped: "striped", hideToolbar: "hideToolbar", lockedTooltipTranslationKey: "lockedTooltipTranslationKey", movingRowsEnabled: "movingRowsEnabled", dragAndDrop: "dragAndDrop", dragAndDropDisabled: "dragAndDropDisabled" }, 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  ~ 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<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      <cds-table-toolbar-search\n        *ngIf=\"isSearchable\"\n        [expandable]=\"true\"\n        [formControl]=\"searchFormControl\"\n        data-test-id=\"carbonListSearch\"\n      ></cds-table-toolbar-search>\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{overflow:hidden}\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.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "component", type: i2$2.Pagination, selector: "cds-pagination, ibm-pagination", inputs: ["skeleton", "model", "disabled", "pageInputDisabled", "showPageInput", "pagesUnknown", "pageSelectThreshold", "translations", "itemsPerPageOptions"], outputs: ["selectPage"] }, { kind: "component", type: i2$2.TableToolbar, selector: "cds-table-toolbar, ibm-table-toolbar", inputs: ["model", "batchText", "ariaLabel", "cancelText", "size"], outputs: ["cancel"] }, { kind: "component", type: i2$2.TableContainer, selector: "cds-table-container, ibm-table-container" }, { kind: "component", type: i2$2.TableHeader, selector: "cds-table-header, ibm-table-header" }, { kind: "component", type: i2$2.TableToolbarActions, selector: "cds-table-toolbar-actions, ibm-table-toolbar-actions" }, { kind: "component", type: i2$2.TableToolbarSearch, selector: "cds-table-toolbar-search, ibm-table-toolbar-search" }, { kind: "component", type: i2$2.TableToolbarContent, selector: "cds-table-toolbar-content, ibm-table-toolbar-content" }, { kind: "component", type: i2$2.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$2.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$2.IconDirective, selector: "[cdsIcon], [ibmIcon]", inputs: ["ibmIcon", "cdsIcon", "size", "title", "ariaLabel", "ariaLabelledBy", "ariaHidden", "isFocusable"] }, { kind: "directive", type: i2$2.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$2.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.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.20", 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 }], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.20", 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", enableSingleSelection: "enableSingleSelection", lastColumnTemplate: "lastColumnTemplate", paginationIdentifier: "paginationIdentifier", showSelectionColumn: "showSelectionColumn", striped: "striped", hideToolbar: "hideToolbar", lockedTooltipTranslationKey: "lockedTooltipTranslationKey", movingRowsEnabled: "movingRowsEnabled", dragAndDrop: "dragAndDrop", dragAndDropDisabled: "dragAndDropDisabled" }, 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  ~ 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<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      <cds-table-toolbar-search\n        *ngIf=\"isSearchable\"\n        [expandable]=\"true\"\n        [formControl]=\"searchFormControl\"\n        data-test-id=\"carbonListSearch\"\n      ></cds-table-toolbar-search>\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{overflow:hidden}\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.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.20", ngImport: i0, type: CarbonListComponent, decorators: [{
             type: Component,
             args: [{ selector: 'valtimo-carbon-list', changeDetection: ChangeDetectionStrategy.OnPush, providers: [CarbonListFilterPipe, CarbonListDragAndDropService], 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<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      <cds-table-toolbar-search\n        *ngIf=\"isSearchable\"\n        [expandable]=\"true\"\n        [formControl]=\"searchFormControl\"\n        data-test-id=\"carbonListSearch\"\n      ></cds-table-toolbar-search>\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{overflow:hidden}\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: EllipsisPipe }, { type: CarbonListFilterPipe }, { type: i2$2.IconService }, { type: i4.NGXLogger }, { type: i1.TranslateService }, { type: ViewContentService }, { type: KeyStateService }, { type: CarbonListDragAndDropService }, { type: i0.ElementRef }], propDecorators: { actionsMenuTemplate: [{
+        }], ctorParameters: () => [{ type: EllipsisPipe }, { type: CarbonListFilterPipe }, { type: i2$3.IconService }, { type: i4.NGXLogger }, { type: i1.TranslateService }, { type: ViewContentService }, { type: KeyStateService }, { type: CarbonListDragAndDropService }, { type: i0.ElementRef }], propDecorators: { actionsMenuTemplate: [{
                 type: ViewChild,
                 args: ['actionsMenuTemplate']
             }], actionTemplate: [{
@@ -7043,15 +7206,17 @@ class BreadcrumbService {
         this._manualSecondBreadcrumb$ = new BehaviorSubject(null);
         this._manualThirdBreadcrumb$ = new BehaviorSubject(null);
         this._manualFourthBreadcrumb$ = new BehaviorSubject(null);
+        this._suppressSecondBreadcrumb$ = new BehaviorSubject(false);
         this._breadcrumbItems$ = combineLatest([
             this.menuService.activeParentSequenceNumber$,
             this.menuService.menuItems$,
             this._manualSecondBreadcrumb$,
             this._manualThirdBreadcrumb$,
             this._manualFourthBreadcrumb$,
+            this._suppressSecondBreadcrumb$,
             this.translateService.stream('key'),
             this.router.events.pipe(startWith(this.router)),
-        ]).pipe(map$1(([activeParentSequenceNumber, menuItems, manualSecondBreadcrumb, manualThirdBreadcrumb, manualFourthBreadcrumb,]) => {
+        ]).pipe(map$1(([activeParentSequenceNumber, menuItems, manualSecondBreadcrumb, manualThirdBreadcrumb, manualFourthBreadcrumb, suppressSecondBreadcrumb,]) => {
             const activeParentBreadcrumbTitle = menuItems.find(menuItem => `${menuItem.sequence}` === activeParentSequenceNumber)?.title;
             const activeParentBreadcrumbTitleTranslation = activeParentBreadcrumbTitle && this.translateService.instant(activeParentBreadcrumbTitle);
             const activeParentBreadcrumbItem = {
@@ -7060,8 +7225,10 @@ class BreadcrumbService {
             const secondBreadCrumb = this.getSecondBreadcrumb();
             return [
                 ...(activeParentSequenceNumber ? [activeParentBreadcrumbItem] : []),
-                ...(manualSecondBreadcrumb ? [manualSecondBreadcrumb] : []),
-                ...(secondBreadCrumb && !manualSecondBreadcrumb ? [secondBreadCrumb] : []),
+                ...(!suppressSecondBreadcrumb && manualSecondBreadcrumb ? [manualSecondBreadcrumb] : []),
+                ...(!suppressSecondBreadcrumb && secondBreadCrumb && !manualSecondBreadcrumb
+                    ? [secondBreadCrumb]
+                    : []),
                 ...(!!manualThirdBreadcrumb ? [manualThirdBreadcrumb] : []),
                 ...(!!manualFourthBreadcrumb ? [manualFourthBreadcrumb] : []),
             ];
@@ -7073,6 +7240,12 @@ class BreadcrumbService {
     clearSecondBreadcrumb() {
         this._manualSecondBreadcrumb$.next(null);
     }
+    suppressSecondBreadcrumb() {
+        this._suppressSecondBreadcrumb$.next(true);
+    }
+    unsuppressSecondBreadcrumb() {
+        this._suppressSecondBreadcrumb$.next(false);
+    }
     setThirdBreadcrumb(breadcrumb) {
         this._manualThirdBreadcrumb$.next(breadcrumb);
     }
@@ -7181,7 +7354,7 @@ class BreadcrumbNavigationComponent {
         this._subscriptions.unsubscribe();
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.20", ngImport: i0, type: BreadcrumbNavigationComponent, deps: [{ token: BreadcrumbService }, { token: PageHeaderService }, { token: PageTitleService }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.20", type: BreadcrumbNavigationComponent, isStandalone: false, selector: "valtimo-breadcrumb-navigation", host: { properties: { "class.valtimo-breadcrumb-navigation--compact": "this.isCompact" } }, 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<ng-container *ngIf=\"breadcrumbItems$ | async as breadcrumbItems\">\n  <div\n    class=\"breadcrumbs-container\"\n    *ngIf=\"breadcrumbItems.length > 0\"\n    [ngClass]=\"{'--compact': compactMode$ | async}\"\n  >\n    <cds-breadcrumb [items]=\"breadcrumbItems\"></cds-breadcrumb>\n  </div>\n</ng-container>\n", styles: [".breadcrumbs-container{margin-bottom:8px;display:flex;width:max-content}.breadcrumbs-container.--compact{margin-bottom:0}.valtimo-breadcrumb-navigation--compact{flex-shrink:0}\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.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i2$2.Breadcrumb, selector: "cds-breadcrumb, ibm-breadcrumb", inputs: ["items", "noTrailingSlash", "ariaLabel", "skeleton", "threshold", "autoAlign", "description"], outputs: ["navigation"] }, { kind: "pipe", type: i1$4.AsyncPipe, name: "async" }], encapsulation: i0.ViewEncapsulation.None }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.20", type: BreadcrumbNavigationComponent, isStandalone: false, selector: "valtimo-breadcrumb-navigation", host: { properties: { "class.valtimo-breadcrumb-navigation--compact": "this.isCompact" } }, 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<ng-container *ngIf=\"breadcrumbItems$ | async as breadcrumbItems\">\n  <div\n    class=\"breadcrumbs-container\"\n    *ngIf=\"breadcrumbItems.length > 0\"\n    [ngClass]=\"{'--compact': compactMode$ | async}\"\n  >\n    <cds-breadcrumb [items]=\"breadcrumbItems\"></cds-breadcrumb>\n  </div>\n</ng-container>\n", styles: [".breadcrumbs-container{margin-bottom:8px;display:flex;width:max-content}.breadcrumbs-container.--compact{margin-bottom:0}.valtimo-breadcrumb-navigation--compact{flex-shrink:0}\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.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i2$3.Breadcrumb, selector: "cds-breadcrumb, ibm-breadcrumb", inputs: ["items", "noTrailingSlash", "ariaLabel", "skeleton", "threshold", "autoAlign", "description"], outputs: ["navigation"] }, { kind: "pipe", type: i1$4.AsyncPipe, name: "async" }], encapsulation: i0.ViewEncapsulation.None }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.20", ngImport: i0, type: BreadcrumbNavigationComponent, decorators: [{
             type: Component,
@@ -7399,11 +7572,11 @@ class PageSubtitleComponent {
         this.compactMode$ = this.pageHeaderService.compactMode$;
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.20", ngImport: i0, type: PageSubtitleComponent, deps: [{ token: i1$3.Router }, { token: i1$3.ActivatedRoute }, { token: PageTitleService }, { token: PageHeaderService }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.20", type: PageSubtitleComponent, isStandalone: true, selector: "valtimo-page-subtitle", 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<ng-container renderPageSubtitle>\n  <ng-template>\n    <div\n      class=\"subtitle-container\"\n      *ngIf=\"{\n        hasCustomPageSubtitle: hasCustomPageSubtitle$ | async,\n        customPageSubtitleSet: customPageSubtitleSet$ | async,\n        customPageSubtitle: customPageSubtitle$ | async,\n        compactMode: compactMode$ | async,\n        hasPageActions: hasPageActions$ | async,\n        pageActionsFullWidth: pageActionsFullWidth$ | async,\n      } as obs\"\n    >\n      <div\n        *ngIf=\"obs.hasCustomPageSubtitle && !obs.customPageSubtitleSet\"\n        class=\"subtitle-skeleton-container\"\n        [ngClass]=\"{'--compact': obs.compactMode}\"\n      >\n        <cds-skeleton-placeholder></cds-skeleton-placeholder>\n      </div>\n\n      <span\n        *ngIf=\"obs.hasCustomPageSubtitle && obs.customPageSubtitleSet\"\n        [innerHtml]=\"obs.customPageSubtitle\"\n        [title]=\"obs.customPageSubtitle\"\n        class=\"page-subtitle\"\n        [ngClass]=\"{'--compact': obs.compactMode}\"\n      >\n      </span>\n    </div>\n  </ng-template>\n</ng-container>\n", styles: [".subtitle-container .subtitle-skeleton-container .cds--skeleton__placeholder{height:18px;margin-bottom:8px;width:200px;margin-left:16px}.subtitle-container .subtitle-skeleton-container.--compact .cds--skeleton__placeholder{height:18px;width:60px;margin:0}.subtitle-container .page-subtitle{margin-left:16px;padding-bottom:4px;color:var(--cds-text-helper, #6f6f6f);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-size:14px;line-height:18px}.subtitle-container .page-subtitle b{font-weight:bolder}.subtitle-container .page-subtitle.--compact{padding-bottom:0;margin-left:0}\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: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$4.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1$4.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "pipe", type: i1$4.AsyncPipe, name: "async" }, { kind: "ngmodule", type: SkeletonModule }, { kind: "component", type: i2$2.SkeletonPlaceholder, selector: "cds-skeleton-placeholder, ibm-skeleton-placeholder" }, { kind: "directive", type: RenderPageSubtitleDirective, selector: "[renderPageSubtitle]" }], encapsulation: i0.ViewEncapsulation.None }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.20", type: PageSubtitleComponent, isStandalone: true, selector: "valtimo-page-subtitle", 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<ng-container renderPageSubtitle>\n  <ng-template>\n    <div\n      class=\"subtitle-container\"\n      *ngIf=\"{\n        hasCustomPageSubtitle: hasCustomPageSubtitle$ | async,\n        customPageSubtitleSet: customPageSubtitleSet$ | async,\n        customPageSubtitle: customPageSubtitle$ | async,\n        compactMode: compactMode$ | async,\n        hasPageActions: hasPageActions$ | async,\n        pageActionsFullWidth: pageActionsFullWidth$ | async,\n      } as obs\"\n    >\n      <div\n        *ngIf=\"obs.hasCustomPageSubtitle && !obs.customPageSubtitleSet\"\n        class=\"subtitle-skeleton-container\"\n        [ngClass]=\"{'--compact': obs.compactMode}\"\n      >\n        <cds-skeleton-placeholder></cds-skeleton-placeholder>\n      </div>\n\n      <span\n        *ngIf=\"obs.hasCustomPageSubtitle && obs.customPageSubtitleSet\"\n        [innerHtml]=\"obs.customPageSubtitle\"\n        [title]=\"obs.customPageSubtitle\"\n        class=\"page-subtitle\"\n        [ngClass]=\"{'--compact': obs.compactMode}\"\n      >\n      </span>\n    </div>\n  </ng-template>\n</ng-container>\n", styles: [".subtitle-container .subtitle-skeleton-container .cds--skeleton__placeholder{height:18px;margin-bottom:8px;width:200px;margin-left:16px}.subtitle-container .subtitle-skeleton-container.--compact .cds--skeleton__placeholder{height:18px;width:60px;margin:0}.subtitle-container .page-subtitle{margin-left:16px;padding-bottom:4px;color:var(--cds-text-helper, #6f6f6f);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-size:14px;line-height:18px}.subtitle-container .page-subtitle b{font-weight:bolder}.subtitle-container .page-subtitle.--compact{padding-bottom:0;margin-left:0}\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: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$4.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1$4.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "pipe", type: i1$4.AsyncPipe, name: "async" }, { kind: "ngmodule", type: SkeletonModule }, { kind: "component", type: i2$3.SkeletonPlaceholder, selector: "cds-skeleton-placeholder, ibm-skeleton-placeholder" }, { kind: "directive", type: RenderPageSubtitleDirective, selector: "[renderPageSubtitle]" }], encapsulation: i0.ViewEncapsulation.None }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.20", ngImport: i0, type: PageSubtitleComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'valtimo-page-subtitle', standalone: true, imports: [CommonModule, SkeletonModule, RenderPageSubtitleDirective, RenderPageHeaderDirective], encapsulation: ViewEncapsulation.None, 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<ng-container renderPageSubtitle>\n  <ng-template>\n    <div\n      class=\"subtitle-container\"\n      *ngIf=\"{\n        hasCustomPageSubtitle: hasCustomPageSubtitle$ | async,\n        customPageSubtitleSet: customPageSubtitleSet$ | async,\n        customPageSubtitle: customPageSubtitle$ | async,\n        compactMode: compactMode$ | async,\n        hasPageActions: hasPageActions$ | async,\n        pageActionsFullWidth: pageActionsFullWidth$ | async,\n      } as obs\"\n    >\n      <div\n        *ngIf=\"obs.hasCustomPageSubtitle && !obs.customPageSubtitleSet\"\n        class=\"subtitle-skeleton-container\"\n        [ngClass]=\"{'--compact': obs.compactMode}\"\n      >\n        <cds-skeleton-placeholder></cds-skeleton-placeholder>\n      </div>\n\n      <span\n        *ngIf=\"obs.hasCustomPageSubtitle && obs.customPageSubtitleSet\"\n        [innerHtml]=\"obs.customPageSubtitle\"\n        [title]=\"obs.customPageSubtitle\"\n        class=\"page-subtitle\"\n        [ngClass]=\"{'--compact': obs.compactMode}\"\n      >\n      </span>\n    </div>\n  </ng-template>\n</ng-container>\n", styles: [".subtitle-container .subtitle-skeleton-container .cds--skeleton__placeholder{height:18px;margin-bottom:8px;width:200px;margin-left:16px}.subtitle-container .subtitle-skeleton-container.--compact .cds--skeleton__placeholder{height:18px;width:60px;margin:0}.subtitle-container .page-subtitle{margin-left:16px;padding-bottom:4px;color:var(--cds-text-helper, #6f6f6f);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-size:14px;line-height:18px}.subtitle-container .page-subtitle b{font-weight:bolder}.subtitle-container .page-subtitle.--compact{padding-bottom:0;margin-left:0}\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-page-subtitle', standalone: true, imports: [CommonModule, SkeletonModule, RenderPageSubtitleDirective], encapsulation: ViewEncapsulation.None, 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<ng-container renderPageSubtitle>\n  <ng-template>\n    <div\n      class=\"subtitle-container\"\n      *ngIf=\"{\n        hasCustomPageSubtitle: hasCustomPageSubtitle$ | async,\n        customPageSubtitleSet: customPageSubtitleSet$ | async,\n        customPageSubtitle: customPageSubtitle$ | async,\n        compactMode: compactMode$ | async,\n        hasPageActions: hasPageActions$ | async,\n        pageActionsFullWidth: pageActionsFullWidth$ | async,\n      } as obs\"\n    >\n      <div\n        *ngIf=\"obs.hasCustomPageSubtitle && !obs.customPageSubtitleSet\"\n        class=\"subtitle-skeleton-container\"\n        [ngClass]=\"{'--compact': obs.compactMode}\"\n      >\n        <cds-skeleton-placeholder></cds-skeleton-placeholder>\n      </div>\n\n      <span\n        *ngIf=\"obs.hasCustomPageSubtitle && obs.customPageSubtitleSet\"\n        [innerHtml]=\"obs.customPageSubtitle\"\n        [title]=\"obs.customPageSubtitle\"\n        class=\"page-subtitle\"\n        [ngClass]=\"{'--compact': obs.compactMode}\"\n      >\n      </span>\n    </div>\n  </ng-template>\n</ng-container>\n", styles: [".subtitle-container .subtitle-skeleton-container .cds--skeleton__placeholder{height:18px;margin-bottom:8px;width:200px;margin-left:16px}.subtitle-container .subtitle-skeleton-container.--compact .cds--skeleton__placeholder{height:18px;width:60px;margin:0}.subtitle-container .page-subtitle{margin-left:16px;padding-bottom:4px;color:var(--cds-text-helper, #6f6f6f);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-size:14px;line-height:18px}.subtitle-container .page-subtitle b{font-weight:bolder}.subtitle-container .page-subtitle.--compact{padding-bottom:0;margin-left:0}\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: i1$3.Router }, { type: i1$3.ActivatedRoute }, { type: PageTitleService }, { type: PageHeaderService }] });
 
 /*
@@ -8192,13 +8365,13 @@ class UploaderComponent {
             this.resourcesChanged.emit(this.resources);
         });
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.20", ngImport: i0, type: UploaderComponent, deps: [{ token: i1$6.S3Service }], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.20", ngImport: i0, type: UploaderComponent, deps: [{ token: i1$5.S3Service }], target: i0.ɵɵFactoryTarget.Component }); }
     static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.20", type: UploaderComponent, isStandalone: false, selector: "valtimo-uploader", inputs: { showFileList: "showFileList" }, outputs: { resourcesChanged: "resourcesChanged", resourceRegistered: "resourceRegistered" }, 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=\"upload-file-container p-5\"\n  (click)=\"fileInput.click()\"\n  valtimoUploaderDragDrop\n  (fileDropped)=\"onFileFieldChange($event)\"\n>\n  <span class=\"align-middle\"><i class=\"mdi mdi-cloud-upload\"></i></span>\n  <input hidden type=\"file\" #fileInput (change)=\"onFileFieldChange($event.target.files)\" multiple />\n</div>\n<div *ngIf=\"showFileList\">\n  <div class=\"files-list px-3 py-2\" *ngFor=\"let resource of resources\">\n    <p class=\"m-0\">\n      <strong>{{ resource.name }}</strong\n      ><br />\n      {{ resource.sizeInBytes | filesize }}\n    </p>\n    <button class=\"delete-file\" (click)=\"deleteResource(resource)\">\n      <i class=\"icon mdi mdi-delete text-danger\"></i>\n    </button>\n  </div>\n</div>\n", styles: [".upload-file-container{background-repeat:no-repeat;background-size:100px;background-position:center;margin:0 0 1rem;border:2px dashed #d5d8de;text-align:center;color:#d5d8de;background-color:#fff}.upload-file-container i.mdi-cloud-upload{font-size:5em}.upload-file-container:hover{cursor:pointer;opacity:.8}.files-list{display:flex;justify-content:space-between;margin:1rem auto;background:#fff;border:1px solid #bdc0c7;padding:5px;font-size:1em}.files-list .delete-file{background:transparent;border:none;cursor:pointer}.files-list .delete-file i{font-size:1.5em}\n"], 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: "directive", type: UploaderDragDropDirective, selector: "[valtimoUploaderDragDrop]", outputs: ["fileDropped"] }, { kind: "pipe", type: FileSizePipe, name: "filesize" }] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.20", ngImport: i0, type: UploaderComponent, decorators: [{
             type: Component,
             args: [{ selector: 'valtimo-uploader', 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=\"upload-file-container p-5\"\n  (click)=\"fileInput.click()\"\n  valtimoUploaderDragDrop\n  (fileDropped)=\"onFileFieldChange($event)\"\n>\n  <span class=\"align-middle\"><i class=\"mdi mdi-cloud-upload\"></i></span>\n  <input hidden type=\"file\" #fileInput (change)=\"onFileFieldChange($event.target.files)\" multiple />\n</div>\n<div *ngIf=\"showFileList\">\n  <div class=\"files-list px-3 py-2\" *ngFor=\"let resource of resources\">\n    <p class=\"m-0\">\n      <strong>{{ resource.name }}</strong\n      ><br />\n      {{ resource.sizeInBytes | filesize }}\n    </p>\n    <button class=\"delete-file\" (click)=\"deleteResource(resource)\">\n      <i class=\"icon mdi mdi-delete text-danger\"></i>\n    </button>\n  </div>\n</div>\n", styles: [".upload-file-container{background-repeat:no-repeat;background-size:100px;background-position:center;margin:0 0 1rem;border:2px dashed #d5d8de;text-align:center;color:#d5d8de;background-color:#fff}.upload-file-container i.mdi-cloud-upload{font-size:5em}.upload-file-container:hover{cursor:pointer;opacity:.8}.files-list{display:flex;justify-content:space-between;margin:1rem auto;background:#fff;border:1px solid #bdc0c7;padding:5px;font-size:1em}.files-list .delete-file{background:transparent;border:none;cursor:pointer}.files-list .delete-file i{font-size:1.5em}\n"] }]
-        }], ctorParameters: () => [{ type: i1$6.S3Service }], propDecorators: { resourcesChanged: [{
+        }], ctorParameters: () => [{ type: i1$5.S3Service }], propDecorators: { resourcesChanged: [{
                 type: Output
             }], resourceRegistered: [{
                 type: Output
@@ -8851,7 +9024,7 @@ class FormioComponent {
         this.readOnly$ = new BehaviorSubject(false);
         this.errors$ = new BehaviorSubject([]);
         this.languageEventEmitter = new EventEmitter();
-        this.currentLanguage$ = this.translateService.stream('key').pipe(map$1(() => this.translateService.currentLang), distinctUntilChanged(), tap(language => this.languageEventEmitter.emit(language)));
+        this.currentLanguage$ = this.translateService.stream('key').pipe(map$1(() => this.translateService.currentLang), distinctUntilChanged(), tap$1(language => this.languageEventEmitter.emit(language)));
         this._overrideOptions$ = new BehaviorSubject({});
         this.formioOptions$ = combineLatest([
             this.options$,
@@ -8868,7 +9041,7 @@ class FormioComponent {
                 }),
             };
             return deepmerge(defaultOptions, overrideOptions);
-        }), distinctUntilChanged((prev, curr) => isEqual(prev, curr)), tap(options => this.logger.debug('Form.IO options used', options)));
+        }), distinctUntilChanged((prev, curr) => isEqual(prev, curr)), tap$1(options => this.logger.debug('Form.IO options used', options)));
         this.tokenSetInLocalStorage$ = this.localStorageService.tokenSetInLocalStorage$;
         this._subscriptions = new Subscription();
         this._tokenTimerSubscription = new Subscription();
@@ -8990,13 +9163,13 @@ class FormioComponent {
             return;
         this._overrideOptions$.next(config.formioOptions);
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.20", ngImport: i0, type: FormioComponent, deps: [{ token: i6.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.20", type: FormioComponent, isStandalone: false, selector: "valtimo-form-io", inputs: { options: "options", submission: "submission", form: "form", readOnly: "readOnly", 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$2.LayerDirective, selector: "[cdsLayer], [ibmLayer]", inputs: ["ibmLayer", "cdsLayer"], exportAs: ["layer"] }, { kind: "pipe", type: i1$4.AsyncPipe, name: "async" }] }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.20", 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.20", type: FormioComponent, isStandalone: false, selector: "valtimo-form-io", inputs: { options: "options", submission: "submission", form: "form", readOnly: "readOnly", 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" }] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.20", 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" }]
-        }], ctorParameters: () => [{ type: i6.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: [{
+        }], 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: [{
                 type: Input
@@ -9122,7 +9295,7 @@ class FormioBuilderComponent {
         // eslint-disable-next-line @angular-eslint/no-output-native
         this.change = new EventEmitter();
         this.triggerRebuild = new EventEmitter();
-        this.currentLanguage$ = this.translateService.stream('key').pipe(map$1(() => this.translateService.currentLang), distinctUntilChanged(), tap(language => this.languageEventEmitter.emit(language)));
+        this.currentLanguage$ = this.translateService.stream('key').pipe(map$1(() => this.translateService.currentLang), distinctUntilChanged(), tap$1(language => this.languageEventEmitter.emit(language)));
         this.languageEventEmitter = new EventEmitter();
         this.options$ = new BehaviorSubject(undefined);
         this._overrideOptions$ = new BehaviorSubject({});
@@ -9141,7 +9314,7 @@ class FormioBuilderComponent {
                 }),
             };
             return deepmerge(defaultOptions, overrideOptions);
-        }), distinctUntilChanged((prev, curr) => isEqual(prev, curr)), tap(() => this.triggerRebuild.emit()));
+        }), distinctUntilChanged((prev, curr) => isEqual(prev, curr)), tap$1(() => this.triggerRebuild.emit()));
         this.editFormModified$ = new BehaviorSubject(false);
         this.modifyEditForm = () => {
             const context$ = getContextObservable(this.route);
@@ -9179,7 +9352,7 @@ class FormioBuilderComponent {
         this._overrideOptions$.next(config.formioOptions);
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.20", ngImport: i0, type: FormioBuilderComponent, deps: [{ token: i1.TranslateService }, { token: FormIoStateService }, { token: i1$2.ConfigService }, { token: i0.Injector }, { token: FormIoTagsService }, { token: i1$3.ActivatedRoute }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.20", type: FormioBuilderComponent, isStandalone: false, selector: "valtimo-form-io-builder", inputs: { form: "form" }, outputs: { change: "change" }, 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=\"(editFormModified$ | async) && form$ | async as formDefinition\"\n>\n  <form-builder\n    [form]=\"formDefinition\"\n    [options]=\"formioOptions$ | async\"\n    [rebuild]=\"triggerRebuild\"\n    (change)=\"onChange($event)\"\n  ></form-builder>\n</div>\n", styles: [""], dependencies: [{ kind: "directive", type: i1$4.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i9.FormBuilderComponent, selector: "form-builder", inputs: ["form", "options", "formbuilder", "noeval", "refresh", "rebuild"], outputs: ["change"] }, { kind: "directive", type: i2$2.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.20", type: FormioBuilderComponent, isStandalone: false, selector: "valtimo-form-io-builder", inputs: { form: "form" }, outputs: { change: "change" }, 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=\"(editFormModified$ | async) && form$ | async as formDefinition\"\n>\n  <form-builder\n    [form]=\"formDefinition\"\n    [options]=\"formioOptions$ | async\"\n    [rebuild]=\"triggerRebuild\"\n    (change)=\"onChange($event)\"\n  ></form-builder>\n</div>\n", styles: [""], dependencies: [{ kind: "directive", type: i1$4.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i9.FormBuilderComponent, selector: "form-builder", inputs: ["form", "options", "formbuilder", "noeval", "refresh", "rebuild"], outputs: ["change"] }, { 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.20", ngImport: i0, type: FormioBuilderComponent, decorators: [{
             type: Component,
@@ -9578,13 +9751,13 @@ class FormIoUploaderComponent {
         this._value = this._value.filter((file) => file?.data ? file?.data?.resourceId !== resourceId : true);
         this.valueChange.emit(this._value);
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.20", ngImport: i0, type: FormIoUploaderComponent, deps: [{ token: i1$6.UploadProviderService }, { token: FormIoStateService }, { token: FormIoDomService }, { token: i1$6.DownloadService }], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.20", ngImport: i0, type: FormIoUploaderComponent, deps: [{ token: i1$5.UploadProviderService }, { token: FormIoStateService }, { token: FormIoDomService }, { token: i1$5.DownloadService }], target: i0.ɵɵFactoryTarget.Component }); }
     static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.20", type: FormIoUploaderComponent, isStandalone: false, selector: "valtimo-form-io-uploader", inputs: { disabled: "disabled", title: "title", hideTitle: "hideTitle", subtitle: "subtitle", maxFileSize: "maxFileSize", hideMaxFileSize: "hideMaxFileSize", camera: "camera", value: "value" }, outputs: { valueChange: "valueChange" }, 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<valtimo-dropzone\n  (fileSelected)=\"fileSelected($event)\"\n  [acceptedFiles]=\"null\"\n  [disabled]=\"disabled\"\n  [hideFilePreview]=\"true\"\n  [hideTitle]=\"hideTitle\"\n  [maxFileSize]=\"maxFileSize\"\n  [showMaxFileSize]=\"!hideMaxFileSize\"\n  [subtitle]=\"subtitle\"\n  [title]=\"title\"\n  [camera]=\"camera\"\n  [uploading]=\"uploading$ | async\"\n></valtimo-dropzone>\n\n<div class=\"file-preview\" *ngFor=\"let resource of _value\">\n  <div class=\"file-preview-name\">\n    <a href=\"#\" (click)=\"downloadFile(resource)\">\n      {{ resource.originalName }}\n    </a>\n  </div>\n  <div class=\"file-preview-size\">\n    <span>\n      {{ resource.size | filesize }}\n    </span>\n  </div>\n  <div class=\"file-preview-delete\" *ngIf=\"!disabled\">\n    <a (click)=\"deleteFile(resource.data.resourceId)\">\n      <i class=\"icon mdi mdi-delete\"></i>\n    </a>\n  </div>\n</div>\n", styles: [".progress-bar-container{padding:15px 20px}::ng-deep .formio-component-valtimo-file .formio-button-add-another,::ng-deep .formio-component-valtimo-file .btn-secondary{display:none}::ng-deep .formio-component-valtimo-file td{padding:0!important;border:none}::ng-deep .formio-component-valtimo-file .table{border-collapse:collapse;border:none;margin:10px 0}.dropzone-container{margin-bottom:12px}.file-preview{margin-top:-1px;display:flex;border:1px solid #dee2e6}.file-preview div{padding:12px 10px}.file-preview .file-preview-name{width:65%}.file-preview .file-preview-size{width:35%}.file-preview .icon{color:#a1a1a1;font-size:1.3846rem;line-height:18px;cursor:pointer}.file-preview .icon:hover{color:gray}\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.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1$4.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: DropzoneComponent, selector: "valtimo-dropzone", inputs: ["title", "hideTitle", "subtitle", "externalError$", "showMaxFileSize", "showAcceptedFiles", "clear$", "disabled", "hideFilePreview", "uploading", "camera", "maxFiles", "maxFileSize", "acceptedFiles"], outputs: ["fileSelected"] }, { kind: "pipe", type: i1$4.AsyncPipe, name: "async" }, { kind: "pipe", type: FileSizePipe, name: "filesize" }] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.20", ngImport: i0, type: FormIoUploaderComponent, decorators: [{
             type: Component,
             args: [{ selector: 'valtimo-form-io-uploader', 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<valtimo-dropzone\n  (fileSelected)=\"fileSelected($event)\"\n  [acceptedFiles]=\"null\"\n  [disabled]=\"disabled\"\n  [hideFilePreview]=\"true\"\n  [hideTitle]=\"hideTitle\"\n  [maxFileSize]=\"maxFileSize\"\n  [showMaxFileSize]=\"!hideMaxFileSize\"\n  [subtitle]=\"subtitle\"\n  [title]=\"title\"\n  [camera]=\"camera\"\n  [uploading]=\"uploading$ | async\"\n></valtimo-dropzone>\n\n<div class=\"file-preview\" *ngFor=\"let resource of _value\">\n  <div class=\"file-preview-name\">\n    <a href=\"#\" (click)=\"downloadFile(resource)\">\n      {{ resource.originalName }}\n    </a>\n  </div>\n  <div class=\"file-preview-size\">\n    <span>\n      {{ resource.size | filesize }}\n    </span>\n  </div>\n  <div class=\"file-preview-delete\" *ngIf=\"!disabled\">\n    <a (click)=\"deleteFile(resource.data.resourceId)\">\n      <i class=\"icon mdi mdi-delete\"></i>\n    </a>\n  </div>\n</div>\n", styles: [".progress-bar-container{padding:15px 20px}::ng-deep .formio-component-valtimo-file .formio-button-add-another,::ng-deep .formio-component-valtimo-file .btn-secondary{display:none}::ng-deep .formio-component-valtimo-file td{padding:0!important;border:none}::ng-deep .formio-component-valtimo-file .table{border-collapse:collapse;border:none;margin:10px 0}.dropzone-container{margin-bottom:12px}.file-preview{margin-top:-1px;display:flex;border:1px solid #dee2e6}.file-preview div{padding:12px 10px}.file-preview .file-preview-name{width:65%}.file-preview .file-preview-size{width:35%}.file-preview .icon{color:#a1a1a1;font-size:1.3846rem;line-height:18px;cursor:pointer}.file-preview .icon:hover{color:gray}\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: i1$6.UploadProviderService }, { type: FormIoStateService }, { type: FormIoDomService }, { type: i1$6.DownloadService }], propDecorators: { disabled: [{
+        }], ctorParameters: () => [{ type: i1$5.UploadProviderService }, { type: FormIoStateService }, { type: FormIoDomService }, { type: i1$5.DownloadService }], propDecorators: { disabled: [{
                 type: Input
             }], title: [{
                 type: Input
@@ -9715,13 +9888,13 @@ class FormIoCurrentUserComponent {
             this.valueChange.emit();
         });
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.20", ngImport: i0, type: FormIoCurrentUserComponent, deps: [{ token: i1$5.KeycloakService }], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.20", ngImport: i0, type: FormIoCurrentUserComponent, deps: [{ token: i2$2.KeycloakService }], target: i0.ɵɵFactoryTarget.Component }); }
     static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.20", type: FormIoCurrentUserComponent, isStandalone: false, selector: "valtimo-formio-current-user", inputs: { value: "value", disabled: "disabled" }, outputs: { valueChange: "valueChange" }, ngImport: i0, template: '{{ this.value?.firstName }} {{ this.value?.lastName }}<br />{{ this.value?.email }}', isInline: true }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.20", ngImport: i0, type: FormIoCurrentUserComponent, decorators: [{
             type: Component,
             args: [{ selector: 'valtimo-formio-current-user', template: '{{ this.value?.firstName }} {{ this.value?.lastName }}<br />{{ this.value?.email }}', standalone: false }]
-        }], ctorParameters: () => [{ type: i1$5.KeycloakService }], propDecorators: { value: [{
+        }], ctorParameters: () => [{ type: i2$2.KeycloakService }], propDecorators: { value: [{
                 type: Input
             }], disabled: [{
                 type: Input
@@ -9927,13 +10100,13 @@ class TooltipDirective {
             this.overlayRef.detach();
         }
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.20", ngImport: i0, type: TooltipDirective, deps: [{ token: i1$7.Overlay }, { token: i1$7.OverlayPositionBuilder }, { token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.20", 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.20", type: TooltipDirective, isStandalone: false, selector: "[vTooltip]", inputs: { text: ["vTooltip", "text"], onBottom: "onBottom", tooltipDisabled: "tooltipDisabled" }, host: { listeners: { "mouseenter": "show()", "mouseleave": "hide()" } }, ngImport: i0 }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.20", ngImport: i0, type: TooltipDirective, decorators: [{
             type: Directive,
             args: [{ selector: '[vTooltip]', standalone: false }]
-        }], ctorParameters: () => [{ type: i1$7.Overlay }, { type: i1$7.OverlayPositionBuilder }, { type: i0.ElementRef }], propDecorators: { text: [{
+        }], ctorParameters: () => [{ type: i1$6.Overlay }, { type: i1$6.OverlayPositionBuilder }, { type: i0.ElementRef }], propDecorators: { text: [{
                 type: Input,
                 args: ['vTooltip']
             }], onBottom: [{
@@ -10031,7 +10204,7 @@ class InputLabelComponent {
         }));
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.20", ngImport: i0, type: InputLabelComponent, deps: [{ token: i1.TranslateService }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.20", type: InputLabelComponent, isStandalone: false, selector: "v-input-label", inputs: { name: "name", tooltip: "tooltip", tooltipTranslationKey: "tooltipTranslationKey", largeMargin: "largeMargin", small: "small", noMargin: "noMargin", title: "title", titleTranslationKey: "titleTranslationKey", required: "required", disabled: "disabled", carbonTheme: "carbonTheme" }, 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=\"v-input-label-container\"\n  [ngClass]=\"{\n    'v-input-label-container--large-margin': largeMargin,\n    'v-input-label-container--no-margin': noMargin,\n  }\"\n>\n  <cds-label [disabled]=\"disabled\">\n    <span class=\"label-with-tooltip\">\n      {{ displayTitle$ | async }}\n\n      <v-tooltip-icon\n        *ngIf=\"tooltip || tooltipTranslationKey\"\n        [disabled]=\"disabled\"\n        [tooltip]=\"tooltipTranslationKey ? (tooltipTranslationKey | translate) : tooltip\"\n      ></v-tooltip-icon>\n    </span>\n\n    <ng-content></ng-content>\n  </cds-label>\n</div>\n", styles: [".v-input-label-container{display:flex;flex-direction:row;align-items:center}.v-input-label-container--large-margin{margin-block-end:var(--v-input-title-margin)}.v-input-label-container--no-margin{margin-block-end:0}.v-input-label-container--no-margin ::ng-deep .cds--label{margin:0}.v-input-label{margin:0;font-size:var(--v-input-title-font-size);color:var(--v-input-title-font-color);line-height:var(--v-input-title-line-height);font-weight:var(--v-input-title-font-weight)}.v-input-label--small{font-size:var(--v-input-title-small-font-size);color:var(--v-input-title-small-font-color);line-height:var(--v-input-title-small-line-height);font-weight:var(--v-input-title-small-font-weight)}.v-input-label__tooltip{display:flex;justify-content:center;align-items:center;font-size:var(--v-input-tooltip-icon-size);width:var(--v-input-tooltip-icon-size);height:var(--v-input-tooltip-icon-size);color:var(--v-input-tooltip-icon-color);margin-inline-start:var(--v-input-tooltip-icon-margin)}.v-input-label--required:after{content:\" *\";color:var(--v-input-required-asterisk-color)}.label-with-tooltip{display:flex;align-items:center}:host ::ng-deep .cds--label{display:flex;flex-direction:column;gap:8px}\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.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: TooltipIconComponent, selector: "v-tooltip-icon", inputs: ["tooltip", "disabled"] }, { kind: "component", type: i2$2.Label, selector: "cds-label, ibm-label", inputs: ["labelInputID", "disabled", "skeleton", "helperText", "invalidText", "invalid", "warn", "warnText", "ariaLabel"] }, { kind: "pipe", type: i1$4.AsyncPipe, name: "async" }, { kind: "pipe", type: i1.TranslatePipe, name: "translate" }] }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.20", type: InputLabelComponent, isStandalone: false, selector: "v-input-label", inputs: { name: "name", tooltip: "tooltip", tooltipTranslationKey: "tooltipTranslationKey", largeMargin: "largeMargin", small: "small", noMargin: "noMargin", title: "title", titleTranslationKey: "titleTranslationKey", required: "required", disabled: "disabled", carbonTheme: "carbonTheme" }, 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=\"v-input-label-container\"\n  [ngClass]=\"{\n    'v-input-label-container--large-margin': largeMargin,\n    'v-input-label-container--no-margin': noMargin,\n  }\"\n>\n  <cds-label [disabled]=\"disabled\">\n    <span class=\"label-with-tooltip\">\n      {{ displayTitle$ | async }}\n\n      <v-tooltip-icon\n        *ngIf=\"tooltip || tooltipTranslationKey\"\n        [disabled]=\"disabled\"\n        [tooltip]=\"tooltipTranslationKey ? (tooltipTranslationKey | translate) : tooltip\"\n      ></v-tooltip-icon>\n    </span>\n\n    <ng-content></ng-content>\n  </cds-label>\n</div>\n", styles: [".v-input-label-container{display:flex;flex-direction:row;align-items:center}.v-input-label-container--large-margin{margin-block-end:var(--v-input-title-margin)}.v-input-label-container--no-margin{margin-block-end:0}.v-input-label-container--no-margin ::ng-deep .cds--label{margin:0}.v-input-label{margin:0;font-size:var(--v-input-title-font-size);color:var(--v-input-title-font-color);line-height:var(--v-input-title-line-height);font-weight:var(--v-input-title-font-weight)}.v-input-label--small{font-size:var(--v-input-title-small-font-size);color:var(--v-input-title-small-font-color);line-height:var(--v-input-title-small-line-height);font-weight:var(--v-input-title-small-font-weight)}.v-input-label__tooltip{display:flex;justify-content:center;align-items:center;font-size:var(--v-input-tooltip-icon-size);width:var(--v-input-tooltip-icon-size);height:var(--v-input-tooltip-icon-size);color:var(--v-input-tooltip-icon-color);margin-inline-start:var(--v-input-tooltip-icon-margin)}.v-input-label--required:after{content:\" *\";color:var(--v-input-required-asterisk-color)}.label-with-tooltip{display:flex;align-items:center}:host ::ng-deep .cds--label{display:flex;flex-direction:column;gap:8px}\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.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: TooltipIconComponent, selector: "v-tooltip-icon", inputs: ["tooltip", "disabled"] }, { kind: "component", type: i2$3.Label, selector: "cds-label, ibm-label", inputs: ["labelInputID", "disabled", "skeleton", "helperText", "invalidText", "invalid", "warn", "warnText", "ariaLabel"] }, { kind: "pipe", type: i1$4.AsyncPipe, name: "async" }, { kind: "pipe", type: i1.TranslatePipe, name: "translate" }] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.20", ngImport: i0, type: InputLabelComponent, decorators: [{
             type: Component,
@@ -10187,7 +10360,7 @@ class ValuePathSelectorComponent {
         return this.formGroup.get('selectedPath');
     }
     get _selectedPath$() {
-        return this.selectedPath.valueChanges.pipe(startWith(this.selectedPath.value), distinctUntilChanged(), tap$1(value => {
+        return this.selectedPath.valueChanges.pipe(startWith(this.selectedPath.value), distinctUntilChanged(), tap(value => {
             if (this._onChangeFunction) {
                 this._onChangeFunction(value);
             }
@@ -10313,7 +10486,7 @@ class ValuePathSelectorComponent {
         this.loadingValuePathItems$ = new BehaviorSubject(true);
         this.disabled$ = new BehaviorSubject(false);
         this._cachedOptions = [];
-        this.valuePathListItems$ = this._parentItem$.pipe(tap$1(() => this.loadingValuePathItems$.next(true)), switchMap((parentItem) => parentItem
+        this.valuePathListItems$ = this._parentItem$.pipe(tap(() => this.loadingValuePathItems$.next(true)), switchMap((parentItem) => parentItem
             ? of(parentItem.children?.map((child) => ({ path: child })) ?? [])
             : combineLatest([
                 this._caseDefinitionKeySubject$,
@@ -10335,12 +10508,12 @@ class ValuePathSelectorComponent {
                 ? this.getFormattedPath(result.path)
                 : result.path,
         }))
-            .sort((a, b) => a.formattedPath.localeCompare(b.formattedPath))), tap$1(options => (this._cachedOptions = options)), switchMap(options => combineLatest([
+            .sort((a, b) => a.formattedPath.localeCompare(b.formattedPath))), tap(options => (this._cachedOptions = options)), switchMap(options => combineLatest([
             of(options),
             this._selectedPath$,
             this.inputModeIsDropdown$,
             this._filteredItems$.pipe(startWith(this._filteredItems$.getValue())),
-        ])), tap$1(([options, selectedPath, inputModeIsDropdown]) => {
+        ])), tap(([options, selectedPath, inputModeIsDropdown]) => {
             const formattedOptions = options.map(option => option.formattedPath);
             if (!formattedOptions.includes(selectedPath) && !!selectedPath && inputModeIsDropdown) {
                 this._inputMode$.next(ValuePathSelectorInputMode.MANUAL);
@@ -10363,7 +10536,7 @@ class ValuePathSelectorComponent {
                     this.onPathSelected(mappedOption);
                 return mappedOption;
             });
-        }), tap$1(() => this.loadingValuePathItems$.next(false)));
+        }), tap(() => this.loadingValuePathItems$.next(false)));
         this._subscriptions = new Subscription();
     }
     ngOnInit() {
@@ -10466,7 +10639,7 @@ class ValuePathSelectorComponent {
                 multi: true,
                 useExisting: forwardRef(() => ValuePathSelectorComponent),
             },
-        ], 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<ng-container\n  *ngIf=\"{\n    inputModeIsDropdown: inputModeIsDropdown$ | async,\n    valuePathListItems: valuePathListItems$ | async,\n    loadingValuePathItems: loadingValuePathItems$ | async,\n    disabled: disabled$ | async,\n    showToggle: showToggle$ | async,\n  } as obs\"\n>\n  <v-input-label *ngIf=\"!!label\" [required]=\"required\" [title]=\"label\" [tooltip]=\"tooltip\">\n  </v-input-label>\n\n  <form\n    [formGroup]=\"formGroup\"\n    [ngClass]=\"{\n      'value-path-selector__form--case-def-input':\n        showCaseDefinitionSelector && obs.inputModeIsDropdown && !obs.showToggle,\n    }\"\n    class=\"value-path-selector__form\"\n  >\n    <cds-toggle\n      *ngIf=\"obs.showToggle\"\n      [attr.data-test-id]=\"testIds.toggle\"\n      size=\"sm\"\n      [disabled]=\"obs.disabled\"\n      [onText]=\"'valuePathSelector.dropdown' | translate\"\n      [offText]=\"'valuePathSelector.manual' | translate\"\n      [checked]=\"obs.inputModeIsDropdown\"\n      (checkedChange)=\"onInputModeChange($event)\"\n    ></cds-toggle>\n\n    @if (obs.inputModeIsDropdown && obs.showToggle) {\n      <cds-combo-box\n        [attr.data-test-id]=\"testIds.path\"\n        [appendInline]=\"appendInline\"\n        [disabled]=\"\n          obs.disabled ||\n          obs.loadingValuePathItems ||\n          !obs.valuePathListItems ||\n          (obs.valuePathListItems || []).length === 0\n        \"\n        [dropUp]=\"dropUp\"\n        (selected)=\"onPathSelected($event)\"\n        (clear)=\"onPathCleared()\"\n        [placeholder]=\"'valuePathSelector.placeholder' | translate\"\n      >\n        <cds-dropdown-list [items]=\"obs.valuePathListItems || []\"></cds-dropdown-list>\n      </cds-combo-box>\n    } @else {\n      <input\n        [attr.data-test-id]=\"testIds.input\"\n        cdsText\n        type=\"text\"\n        formControlName=\"selectedPath\"\n      />\n    }\n  </form>\n</ng-container>\n", styles: [":host{width:100%;display:flex;flex-direction:column}::ng-deep .value-path-selector--margin-bottom{margin-bottom:16px}::ng-deep .value-path-selector--margin-bottom-lg{margin-bottom:24px}::ng-deep .value-path-selector--margin-bottom-xl{margin-bottom:34px}.value-path-selector__form{display:flex;width:100%;align-items:center;gap:16px}::ng-deep .value-path-selector__form--case-def-input{display:flex!important}.value-path-selector__form ::ng-deep cds-dropdown,.value-path-selector__form ::ng-deep cds-combo-box{width:100%;min-width:0}.value-path-selector__form ::ng-deep .cds--toggle__label-text{display:none}.value-path-selector__form ::ng-deep .cds--toggle__label{display:flex}\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: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$4.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1$4.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "pipe", type: i1$4.AsyncPipe, name: "async" }, { kind: "ngmodule", type: ComboBoxModule }, { kind: "component", type: i2$2.ComboBox, selector: "cds-combo-box, ibm-combo-box", inputs: ["placeholder", "openMenuAria", "closeMenuAria", "clearSelectionsTitle", "clearSelectionsAria", "clearSelectionTitle", "clearSelectionAria", "id", "labelId", "items", "type", "size", "itemValueKey", "label", "hideLabel", "helperText", "appendInline", "invalid", "invalidText", "warn", "warnText", "maxLength", "theme", "selectionFeedback", "autocomplete", "dropUp", "disabled", "readonly", "fluid"], outputs: ["selected", "submit", "close", "search", "clear"] }, { kind: "component", type: i2$2.DropdownList, selector: "cds-dropdown-list, ibm-dropdown-list", inputs: ["ariaLabel", "items", "listTpl", "type", "showTitles"], outputs: ["select", "scroll", "blurIntent"] }, { kind: "ngmodule", type: LoadingModule }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i2.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i2.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i2.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i2.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "ngmodule", type: ToggleModule }, { kind: "component", type: i2$2.Toggle, selector: "cds-toggle, ibm-toggle", inputs: ["offText", "onText", "label", "size", "hideLabel", "ariaLabel", "skeleton"] }, { kind: "ngmodule", type: InputModule$1 }, { kind: "directive", type: i2$2.TextInput, selector: "[cdsText], [ibmText]", inputs: ["theme", "size", "invalid", "warn", "skeleton"] }, { 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: TranslateModule }, { kind: "pipe", type: i1.TranslatePipe, name: "translate" }, { kind: "ngmodule", type: LayerModule }] }); }
+        ], 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<ng-container\n  *ngIf=\"{\n    inputModeIsDropdown: inputModeIsDropdown$ | async,\n    valuePathListItems: valuePathListItems$ | async,\n    loadingValuePathItems: loadingValuePathItems$ | async,\n    disabled: disabled$ | async,\n    showToggle: showToggle$ | async,\n  } as obs\"\n>\n  <v-input-label *ngIf=\"!!label\" [required]=\"required\" [title]=\"label\" [tooltip]=\"tooltip\">\n  </v-input-label>\n\n  <form\n    [formGroup]=\"formGroup\"\n    [ngClass]=\"{\n      'value-path-selector__form--case-def-input':\n        showCaseDefinitionSelector && obs.inputModeIsDropdown && !obs.showToggle,\n    }\"\n    class=\"value-path-selector__form\"\n  >\n    <cds-toggle\n      *ngIf=\"obs.showToggle\"\n      [attr.data-test-id]=\"testIds.toggle\"\n      size=\"sm\"\n      [disabled]=\"obs.disabled\"\n      [onText]=\"'valuePathSelector.dropdown' | translate\"\n      [offText]=\"'valuePathSelector.manual' | translate\"\n      [checked]=\"obs.inputModeIsDropdown\"\n      (checkedChange)=\"onInputModeChange($event)\"\n    ></cds-toggle>\n\n    @if (obs.inputModeIsDropdown && obs.showToggle) {\n      <cds-combo-box\n        [attr.data-test-id]=\"testIds.path\"\n        [appendInline]=\"appendInline\"\n        [disabled]=\"\n          obs.disabled ||\n          obs.loadingValuePathItems ||\n          !obs.valuePathListItems ||\n          (obs.valuePathListItems || []).length === 0\n        \"\n        [dropUp]=\"dropUp\"\n        (selected)=\"onPathSelected($event)\"\n        (clear)=\"onPathCleared()\"\n        [placeholder]=\"'valuePathSelector.placeholder' | translate\"\n      >\n        <cds-dropdown-list [items]=\"obs.valuePathListItems || []\"></cds-dropdown-list>\n      </cds-combo-box>\n    } @else {\n      <input\n        [attr.data-test-id]=\"testIds.input\"\n        cdsText\n        type=\"text\"\n        formControlName=\"selectedPath\"\n      />\n    }\n  </form>\n</ng-container>\n", styles: [":host{width:100%;display:flex;flex-direction:column}::ng-deep .value-path-selector--margin-bottom{margin-bottom:16px}::ng-deep .value-path-selector--margin-bottom-lg{margin-bottom:24px}::ng-deep .value-path-selector--margin-bottom-xl{margin-bottom:34px}.value-path-selector__form{display:flex;width:100%;align-items:center;gap:16px}::ng-deep .value-path-selector__form--case-def-input{display:flex!important}.value-path-selector__form ::ng-deep cds-dropdown,.value-path-selector__form ::ng-deep cds-combo-box{width:100%;min-width:0}.value-path-selector__form ::ng-deep .cds--toggle__label-text{display:none}.value-path-selector__form ::ng-deep .cds--toggle__label{display:flex}\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: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$4.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1$4.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "pipe", type: i1$4.AsyncPipe, name: "async" }, { kind: "ngmodule", type: ComboBoxModule }, { kind: "component", type: i2$3.ComboBox, selector: "cds-combo-box, ibm-combo-box", inputs: ["placeholder", "openMenuAria", "closeMenuAria", "clearSelectionsTitle", "clearSelectionsAria", "clearSelectionTitle", "clearSelectionAria", "id", "labelId", "items", "type", "size", "itemValueKey", "label", "hideLabel", "helperText", "appendInline", "invalid", "invalidText", "warn", "warnText", "maxLength", "theme", "selectionFeedback", "autocomplete", "dropUp", "disabled", "readonly", "fluid"], outputs: ["selected", "submit", "close", "search", "clear"] }, { kind: "component", type: i2$3.DropdownList, selector: "cds-dropdown-list, ibm-dropdown-list", inputs: ["ariaLabel", "items", "listTpl", "type", "showTitles"], outputs: ["select", "scroll", "blurIntent"] }, { kind: "ngmodule", type: LoadingModule }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i2.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i2.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i2.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i2.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "ngmodule", type: ToggleModule }, { kind: "component", type: i2$3.Toggle, selector: "cds-toggle, ibm-toggle", inputs: ["offText", "onText", "label", "size", "hideLabel", "ariaLabel", "skeleton"] }, { kind: "ngmodule", type: InputModule$1 }, { kind: "directive", type: i2$3.TextInput, selector: "[cdsText], [ibmText]", inputs: ["theme", "size", "invalid", "warn", "skeleton"] }, { 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: TranslateModule }, { kind: "pipe", type: i1.TranslatePipe, name: "translate" }, { kind: "ngmodule", type: LayerModule }] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.20", ngImport: i0, type: ValuePathSelectorComponent, decorators: [{
             type: Component,
@@ -10593,7 +10766,7 @@ class FormioValueResolverSelectorComponent {
         }
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.20", ngImport: i0, type: FormioValueResolverSelectorComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.20", type: FormioValueResolverSelectorComponent, isStandalone: true, selector: "valtimo-formio-value-resolver-selector", inputs: { disabled: "disabled", label: "label", resolverType: "resolverType", value: "value" }, outputs: { valueChange: "valueChange" }, 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@if (isIndependentContext$ | async) {\n  <input\n    cdsText\n    type=\"text\"\n    [value]=\"defaultValue$ | async\"\n    [cdsLayer]=\"1\"\n    (input)=\"onValueChange($any($event.target).value)\"\n  />\n} @else {\n  <valtimo-value-path-selector\n    [caseDefinitionKey]=\"caseDefinitionKey$ | async\"\n    [caseDefinitionVersionTag]=\"caseDefinitionVersionTag$ | async\"\n    [buildingBlockDefinitionKey]=\"buildingBlockDefinitionKey$ | async\"\n    [buildingBlockDefinitionVersionTag]=\"buildingBlockDefinitionVersionTag$ | async\"\n    [appendInline]=\"true\"\n    [defaultValue]=\"defaultValue$ | async\"\n    [label]=\"label\"\n    [showCaseDefinitionSelector]=\"true\"\n    notation=\"slashes\"\n    [prefixes]=\"[ValuePathSelectorPrefix.DOC]\"\n    [cdsLayer]=\"1\"\n    (valueChangeEvent)=\"onValueChange($event)\"\n  ></valtimo-value-path-selector>\n}\n", dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "pipe", type: i1$4.AsyncPipe, name: "async" }, { kind: "component", type: ValuePathSelectorComponent, selector: "valtimo-value-path-selector", inputs: ["name", "appendInline", "margin", "marginLg", "marginXl", "disabled", "caseDefinitionKey", "caseDefinitionVersionTag", "buildingBlockDefinitionKey", "buildingBlockDefinitionVersionTag", "prefixes", "label", "tooltip", "required", "showCaseDefinitionSelector", "notation", "dropUp", "defaultValue", "type", "parentItem", "filterItems"], outputs: ["valueChangeEvent", "collectionSelected"] }, { kind: "ngmodule", type: LayerModule }, { kind: "directive", type: i2$2.LayerDirective, selector: "[cdsLayer], [ibmLayer]", inputs: ["ibmLayer", "cdsLayer"], exportAs: ["layer"] }, { kind: "ngmodule", type: InputModule$1 }, { kind: "directive", type: i2$2.TextInput, selector: "[cdsText], [ibmText]", inputs: ["theme", "size", "invalid", "warn", "skeleton"] }] }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.20", type: FormioValueResolverSelectorComponent, isStandalone: true, selector: "valtimo-formio-value-resolver-selector", inputs: { disabled: "disabled", label: "label", resolverType: "resolverType", value: "value" }, outputs: { valueChange: "valueChange" }, 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@if (isIndependentContext$ | async) {\n  <input\n    cdsText\n    type=\"text\"\n    [value]=\"defaultValue$ | async\"\n    [cdsLayer]=\"1\"\n    (input)=\"onValueChange($any($event.target).value)\"\n  />\n} @else {\n  <valtimo-value-path-selector\n    [caseDefinitionKey]=\"caseDefinitionKey$ | async\"\n    [caseDefinitionVersionTag]=\"caseDefinitionVersionTag$ | async\"\n    [buildingBlockDefinitionKey]=\"buildingBlockDefinitionKey$ | async\"\n    [buildingBlockDefinitionVersionTag]=\"buildingBlockDefinitionVersionTag$ | async\"\n    [appendInline]=\"true\"\n    [defaultValue]=\"defaultValue$ | async\"\n    [label]=\"label\"\n    [showCaseDefinitionSelector]=\"true\"\n    notation=\"slashes\"\n    [prefixes]=\"[ValuePathSelectorPrefix.DOC]\"\n    [cdsLayer]=\"1\"\n    (valueChangeEvent)=\"onValueChange($event)\"\n  ></valtimo-value-path-selector>\n}\n", dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "pipe", type: i1$4.AsyncPipe, name: "async" }, { kind: "component", type: ValuePathSelectorComponent, selector: "valtimo-value-path-selector", inputs: ["name", "appendInline", "margin", "marginLg", "marginXl", "disabled", "caseDefinitionKey", "caseDefinitionVersionTag", "buildingBlockDefinitionKey", "buildingBlockDefinitionVersionTag", "prefixes", "label", "tooltip", "required", "showCaseDefinitionSelector", "notation", "dropUp", "defaultValue", "type", "parentItem", "filterItems"], outputs: ["valueChangeEvent", "collectionSelected"] }, { kind: "ngmodule", type: LayerModule }, { kind: "directive", type: i2$3.LayerDirective, selector: "[cdsLayer], [ibmLayer]", inputs: ["ibmLayer", "cdsLayer"], exportAs: ["layer"] }, { kind: "ngmodule", type: InputModule$1 }, { kind: "directive", type: i2$3.TextInput, selector: "[cdsText], [ibmText]", inputs: ["theme", "size", "invalid", "warn", "skeleton"] }] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.20", ngImport: i0, type: FormioValueResolverSelectorComponent, decorators: [{
             type: Component,
@@ -11052,7 +11225,7 @@ class SpinnerComponent {
         this.noMarginTop = false;
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.20", ngImport: i0, type: SpinnerComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.20", type: SpinnerComponent, isStandalone: false, selector: "valtimo-spinner", inputs: { useBootstrapSpinner: "useBootstrapSpinner", name: "name", type: "type", size: "size", color: "color", bdColor: "bdColor", fullScreen: "fullScreen", noMarginTop: "noMarginTop" }, 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<ng-container *ngIf=\"useBootstrapSpinner; else ngxSpinner\">\n  <div class=\"spinner-container\" [ngClass]=\"{'no-margin-top': noMarginTop}\">\n    <div class=\"spinner-border text-primary\" role=\"status\">\n      <span class=\"sr-only\">{{ 'interface.loading' | translate }}</span>\n    </div>\n  </div>\n</ng-container>\n\n<ng-template #ngxSpinner>\n  <ngx-spinner\n    [bdColor]=\"bdColor\"\n    [fullScreen]=\"fullScreen\"\n    [name]=\"name\"\n    [color]=\"color\"\n    [size]=\"size\"\n    [type]=\"type\"\n  >\n  </ngx-spinner>\n</ng-template>\n", styles: [".spinner-container{display:flex;justify-content:center;width:100%;margin-top:30px}.spinner-container.no-margin-top{margin-top:0}\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.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i2$3.NgxSpinnerComponent, selector: "ngx-spinner", inputs: ["bdColor", "size", "color", "type", "fullScreen", "name", "zIndex", "template", "showSpinner", "disableAnimation"] }, { kind: "pipe", type: i1.TranslatePipe, name: "translate" }] }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.20", type: SpinnerComponent, isStandalone: false, selector: "valtimo-spinner", inputs: { useBootstrapSpinner: "useBootstrapSpinner", name: "name", type: "type", size: "size", color: "color", bdColor: "bdColor", fullScreen: "fullScreen", noMarginTop: "noMarginTop" }, 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<ng-container *ngIf=\"useBootstrapSpinner; else ngxSpinner\">\n  <div class=\"spinner-container\" [ngClass]=\"{'no-margin-top': noMarginTop}\">\n    <div class=\"spinner-border text-primary\" role=\"status\">\n      <span class=\"sr-only\">{{ 'interface.loading' | translate }}</span>\n    </div>\n  </div>\n</ng-container>\n\n<ng-template #ngxSpinner>\n  <ngx-spinner\n    [bdColor]=\"bdColor\"\n    [fullScreen]=\"fullScreen\"\n    [name]=\"name\"\n    [color]=\"color\"\n    [size]=\"size\"\n    [type]=\"type\"\n  >\n  </ngx-spinner>\n</ng-template>\n", styles: [".spinner-container{display:flex;justify-content:center;width:100%;margin-top:30px}.spinner-container.no-margin-top{margin-top:0}\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.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i2$4.NgxSpinnerComponent, selector: "ngx-spinner", inputs: ["bdColor", "size", "color", "type", "fullScreen", "name", "zIndex", "template", "showSpinner", "disableAnimation"] }, { kind: "pipe", type: i1.TranslatePipe, name: "translate" }] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.20", ngImport: i0, type: SpinnerComponent, decorators: [{
             type: Component,
@@ -11623,7 +11796,7 @@ class MultiselectDropdownComponent {
         this.itemsSelected.emit(this.selectedItems);
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.20", ngImport: i0, type: MultiselectDropdownComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.20", type: MultiselectDropdownComponent, isStandalone: false, selector: "valtimo-multiselect-dropdown", inputs: { selectedItems: "selectedItems", items: "items", placeHolder: "placeHolder", dropdownSettings: "dropdownSettings" }, outputs: { itemsSelected: "itemsSelected" }, 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<ng-multiselect-dropdown\n  [placeholder]=\"placeHolder\"\n  [data]=\"items\"\n  [(ngModel)]=\"selectedItems\"\n  [settings]=\"dropdownSettings\"\n  (onDropDownClose)=\"onItemsSelected()\"\n></ng-multiselect-dropdown>\n", styles: ["/*!\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: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "component", type: i2$4.MultiSelectComponent, selector: "ng-multiselect-dropdown", inputs: ["placeholder", "disabled", "settings", "data"], outputs: ["onFilterChange", "onDropDownClose", "onSelect", "onDeSelect", "onSelectAll", "onDeSelectAll"] }, { kind: "directive", type: i2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }] }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.20", type: MultiselectDropdownComponent, isStandalone: false, selector: "valtimo-multiselect-dropdown", inputs: { selectedItems: "selectedItems", items: "items", placeHolder: "placeHolder", dropdownSettings: "dropdownSettings" }, outputs: { itemsSelected: "itemsSelected" }, 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<ng-multiselect-dropdown\n  [placeholder]=\"placeHolder\"\n  [data]=\"items\"\n  [(ngModel)]=\"selectedItems\"\n  [settings]=\"dropdownSettings\"\n  (onDropDownClose)=\"onItemsSelected()\"\n></ng-multiselect-dropdown>\n", styles: ["/*!\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: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "component", type: i2$5.MultiSelectComponent, selector: "ng-multiselect-dropdown", inputs: ["placeholder", "disabled", "settings", "data"], outputs: ["onFilterChange", "onDropDownClose", "onSelect", "onDeSelect", "onSelectAll", "onDeSelectAll"] }, { kind: "directive", type: i2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.20", ngImport: i0, type: MultiselectDropdownComponent, decorators: [{
             type: Component,
@@ -12076,13 +12249,13 @@ class InputComponent {
             });
         }
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.20", ngImport: i0, type: InputComponent, deps: [{ token: i2$2.IconService }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.20", type: InputComponent, isStandalone: false, selector: "v-input", inputs: { name: "name", type: "type", title: "title", titleTranslationKey: "titleTranslationKey", defaultValue: "defaultValue", widthPx: "widthPx", fullWidth: "fullWidth", margin: "margin", smallMargin: "smallMargin", disabled: "disabled", step: "step", min: "min", maxLength: "maxLength", tooltip: "tooltip", required: "required", hideNumberSpinBox: "hideNumberSpinBox", smallLabel: "smallLabel", rows: "rows", clear$: "clear$", carbonTheme: "carbonTheme", placeholder: "placeholder", dataTestId: "dataTestId", trim: "trim", presetsTitle: "presetsTitle", presetOptions: "presetOptions" }, outputs: { valueChange: "valueChange" }, host: { properties: { "class.full-width": "this.fullWidthClass" } }, 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 class=\"v-input-container\">\n  <ng-container *ngTemplateOutlet=\"inputTitle\"></ng-container>\n  <ng-container *ngTemplateOutlet=\"textInput\"></ng-container>\n  <ng-container *ngTemplateOutlet=\"textareaInput\"></ng-container>\n  <ng-container *ngTemplateOutlet=\"passwordInput\"></ng-container>\n  <ng-container *ngTemplateOutlet=\"numberInput\"></ng-container>\n  <ng-container *ngTemplateOutlet=\"digitOnlyInput\"></ng-container>\n  <ng-container *ngTemplateOutlet=\"checkboxInput\"></ng-container>\n  <ng-container *ngTemplateOutlet=\"bsnInput\"></ng-container>\n  <ng-container *ngTemplateOutlet=\"presets\"></ng-container>\n</div>\n\n<ng-template #inputTitle>\n  <v-input-label\n    *ngIf=\"title || titleTranslationKey\"\n    [name]=\"name\"\n    [required]=\"required\"\n    [small]=\"smallLabel\"\n    [titleTranslationKey]=\"titleTranslationKey\"\n    [title]=\"title\"\n    [tooltip]=\"tooltip\"\n  >\n  </v-input-label>\n</ng-template>\n\n<ng-template #textInput>\n  <input\n    *ngIf=\"isText\"\n    [ngClass]=\"{\n      'v-input--full-width': fullWidthClass,\n      'v-input--margin': margin && presetOptions.length === 0,\n      'v-input--small-margin': smallMargin && presetOptions.length === 0,\n    }\"\n    [ngModel]=\"inputValue$ | async\"\n    cdsText\n    [attr.data-testid]=\"dataTestId\"\n    [disabled]=\"disabled\"\n    [maxLength]=\"maxLength\"\n    [min]=\"0\"\n    [name]=\"name\"\n    [step]=\"step\"\n    (ngModelChange)=\"onValueChange($event)\"\n    [style.width.px]=\"widthPx\"\n    [placeholder]=\"placeholder\"\n    type=\"text\"\n  />\n</ng-template>\n\n<ng-template #textareaInput>\n  <textarea\n    *ngIf=\"isTextarea\"\n    [ngClass]=\"{\n      'v-input--full-width': fullWidthClass,\n      'v-input--margin': margin,\n      'v-input--small-margin': smallMargin,\n    }\"\n    cdsTextArea\n    [attr.data-testid]=\"dataTestId\"\n    [disabled]=\"disabled\"\n    [name]=\"name\"\n    [ngModel]=\"inputValue$ | async\"\n    [rows]=\"rows\"\n    (ngModelChange)=\"onValueChange($event)\"\n    [style.width.px]=\"widthPx\"\n  ></textarea>\n</ng-template>\n\n<ng-template #passwordInput>\n  <ng-container *ngIf=\"isPassword\">\n    <div\n      *ngIf=\"{showPassword: showPassword$ | async} as obs\"\n      [ngClass]=\"{\n        'v-input--full-width': fullWidthClass,\n        'v-input--margin': margin,\n        'v-input--small-margin': smallMargin,\n      }\"\n      class=\"v-input__password-container\"\n    >\n      <input\n        [ngClass]=\"{\n          'v-input--full-width': fullWidthClass,\n        }\"\n        cdsText\n        [attr.data-testid]=\"dataTestId\"\n        [disabled]=\"disabled\"\n        [maxLength]=\"maxLength\"\n        [min]=\"0\"\n        [name]=\"name\"\n        [ngModel]=\"inputValue$ | async\"\n        [step]=\"step\"\n        (ngModelChange)=\"onValueChange($event)\"\n        [style.width.px]=\"widthPx\"\n        [type]=\"obs.showPassword ? 'text' : 'password'\"\n      />\n\n      <div class=\"v-input__password-icon\">\n        <cds-icon-button align=\"top\" (click)=\"toggleShowPassword()\">\n          <svg cdsIcon=\"{{ obs.showPassword ? 'view-off' : 'view' }}\" size=\"16\"></svg>\n        </cds-icon-button>\n      </div>\n    </div>\n  </ng-container>\n</ng-template>\n\n<ng-template #numberInput>\n  <input\n    *ngIf=\"isNumber\"\n    [ngClass]=\"{\n      'v-input--full-width': fullWidthClass,\n      'v-input--margin': margin,\n      'v-input--small-margin': smallMargin,\n      'v-input--hide-spinbox': hideNumberSpinBox,\n    }\"\n    cdsText\n    [attr.data-testid]=\"dataTestId\"\n    [disabled]=\"disabled\"\n    [maxLength]=\"maxLength\"\n    [min]=\"min\"\n    [name]=\"name\"\n    [ngModel]=\"inputValue$ | async\"\n    [step]=\"step\"\n    (ngModelChange)=\"onValueChange($event)\"\n    [placeholder]=\"placeholder\"\n    [style.width.px]=\"widthPx\"\n    type=\"number\"\n  />\n</ng-template>\n\n<ng-template #digitOnlyInput>\n  <input\n    *ngIf=\"isDigitOnly\"\n    [ngClass]=\"{\n      'v-input--full-width': fullWidthClass,\n      'v-input--margin': margin,\n      'v-input--small-margin': smallMargin,\n    }\"\n    cdsText\n    digitOnly\n    [attr.data-testid]=\"dataTestId\"\n    [disabled]=\"disabled\"\n    [maxLength]=\"maxLength\"\n    [min]=\"0\"\n    [name]=\"name\"\n    [ngModel]=\"inputValue$ | async\"\n    [step]=\"step\"\n    (ngModelChange)=\"onValueChange($event)\"\n    [style.width.px]=\"widthPx\"\n    type=\"text\"\n  />\n</ng-template>\n\n<ng-template #checkboxInput>\n  <div *ngIf=\"isCheckbox\" (click)=\"stopCheckboxEventPropagation($event)\">\n    <cds-checkbox\n      [attr.data-testid]=\"dataTestId\"\n      [disabled]=\"disabled\"\n      [name]=\"name\"\n      [ngModel]=\"inputValue$ | async\"\n      (ngModelChange)=\"onValueChange($event)\"\n    >\n    </cds-checkbox>\n  </div>\n</ng-template>\n\n<ng-template #presets>\n  <div\n    *ngIf=\"isText && presetOptions.length > 0\"\n    [ngClass]=\"{\n      'v-input--margin': margin,\n      'v-input--small-margin': smallMargin,\n    }\"\n    class=\"v-input--preset-options\"\n  >\n    <span>{{ presetsTitle }}:</span>\n\n    @for (preset of presetOptions; track $index) {\n      @if (!$first) {\n        |\n      }\n      <a (click)=\"presetWithValue(preset)\" class=\"v-input--preset-option\">{{ preset }}</a>\n    }\n  </div>\n</ng-template>\n\n<ng-template #bsnInput>\n  <input\n    *ngIf=\"isBsn\"\n    [ngClass]=\"{\n      'v-input--full-width': fullWidthClass,\n      'v-input--margin': margin && presetOptions.length === 0,\n      'v-input--small-margin': smallMargin && presetOptions.length === 0,\n    }\"\n    [ngModel]=\"inputValue$ | async\"\n    cdsText\n    [attr.data-testid]=\"dataTestId\"\n    [disabled]=\"disabled\"\n    [maxLength]=\"'9'\"\n    [min]=\"9\"\n    [name]=\"name\"\n    (ngModelChange)=\"onValueChange($event)\"\n    [style.width.px]=\"widthPx\"\n    [placeholder]=\"placeholder\"\n    type=\"text\"\n  />\n</ng-template>\n", styles: [".full-width{width:100%}.v-input-container{display:flex;flex-direction:column}.v-input__label{margin:0;font-size:var(--v-input-title-font-size);color:var(--v-input-title-font-color);line-height:var(--v-input-title-line-height);font-weight:var(--v-input-title-font-weight);margin-block-end:var(--v-input-title-margin)}.v-input{all:unset;font-size:var(--v-input-font-size);line-height:var(--v-input-line-height);color:var(--v-input-color);font-weight:var(--v-input-font-weight);padding-block-start:var(--v-input-padding-block);padding-block-end:var(--v-input-padding-block);padding-inline-start:var(--v-input-padding-inline);padding-inline-end:var(--v-input-padding-inline);background-color:var(--v-input-bg-color);border-radius:var(--v-input-border-radius);border:var(--v-input-border);transition:var(--v-input-transition);width:var(--v-input-default-width);box-sizing:border-box}.v-input:focus{outline:var(--v-input-focus-border);outline-offset:var(--v-outline-offset)}.v-input:disabled{color:var(--v-input-font-color-disabled);cursor:var(--v-input-disabled-cursor)}.v-input--full-width{width:100%}.v-input--margin{margin-block-end:var(--v-input-margin)}.v-input--small-margin{margin-block-end:var(--v-input-small-margin)}.v-input__password-container{display:flex;flex-direction:row;align-items:center}.v-input__password-icon{margin-inline-start:var(--v-input-password-icon-spacing)}.v-input--hide-spinbox::-webkit-outer-spin-button,.v-input--hide-spinbox::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}.v-input--hide-spinbox{-moz-appearance:textfield}.v-input--checkbox{width:20px;height:20px;margin-block-end:var(--v-input-margin)}div.v-input--preset-options{margin-top:3px;font-size:var(--v-input-font-size);color:var(--v-input-color)}div.v-input--preset-options span:first-child{padding-right:3px}div.v-input--preset-options a.v-input--preset-option{cursor:pointer;font-style:italic}\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.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1$4.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i2.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i2.NumberValueAccessor, selector: "input[type=number][formControlName],input[type=number][formControl],input[type=number][ngModel]" }, { kind: "directive", type: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.MinValidator, selector: "input[type=number][min][formControlName],input[type=number][min][formControl],input[type=number][min][ngModel]", inputs: ["min"] }, { kind: "directive", type: i2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: InputLabelComponent, selector: "v-input-label", inputs: ["name", "tooltip", "tooltipTranslationKey", "largeMargin", "small", "noMargin", "title", "titleTranslationKey", "required", "disabled", "carbonTheme"] }, { kind: "component", type: i2$2.IconButton, selector: "cds-icon-button, ibm-icon-button", inputs: ["buttonNgClass", "buttonAttributes", "buttonId", "kind", "size", "type", "isExpressive", "disabled", "description", "showTooltipWhenDisabled"], outputs: ["click", "focus", "blur", "tooltipClick"] }, { kind: "component", type: i2$2.Checkbox, selector: "cds-checkbox, ibm-checkbox", inputs: ["disabled", "skeleton", "hideLabel", "name", "id", "required", "value", "ariaLabel", "ariaLabelledby", "indeterminate", "checked"], outputs: ["click", "checkedChange", "indeterminateChange"] }, { kind: "directive", type: i2$2.TextInput, selector: "[cdsText], [ibmText]", inputs: ["theme", "size", "invalid", "warn", "skeleton"] }, { kind: "directive", type: i2$2.TextArea, selector: "[cdsTextArea], [ibmTextArea]", inputs: ["theme", "invalid", "skeleton"] }, { kind: "directive", type: i2$2.IconDirective, selector: "[cdsIcon], [ibmIcon]", inputs: ["ibmIcon", "cdsIcon", "size", "title", "ariaLabel", "ariaLabelledBy", "ariaHidden", "isFocusable"] }, { kind: "directive", type: DigitOnlyDirective, selector: "[digitOnly]", inputs: ["decimal", "decimalSeparator", "allowNegatives", "allowPaste", "negativeSign", "min", "max", "pattern"] }, { kind: "pipe", type: i1$4.AsyncPipe, name: "async" }] }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.20", ngImport: i0, type: InputComponent, deps: [{ token: i2$3.IconService }], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.20", type: InputComponent, isStandalone: false, selector: "v-input", inputs: { name: "name", type: "type", title: "title", titleTranslationKey: "titleTranslationKey", defaultValue: "defaultValue", widthPx: "widthPx", fullWidth: "fullWidth", margin: "margin", smallMargin: "smallMargin", disabled: "disabled", step: "step", min: "min", maxLength: "maxLength", tooltip: "tooltip", required: "required", hideNumberSpinBox: "hideNumberSpinBox", smallLabel: "smallLabel", rows: "rows", clear$: "clear$", carbonTheme: "carbonTheme", placeholder: "placeholder", dataTestId: "dataTestId", trim: "trim", presetsTitle: "presetsTitle", presetOptions: "presetOptions" }, outputs: { valueChange: "valueChange" }, host: { properties: { "class.full-width": "this.fullWidthClass" } }, 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 class=\"v-input-container\">\n  <ng-container *ngTemplateOutlet=\"inputTitle\"></ng-container>\n  <ng-container *ngTemplateOutlet=\"textInput\"></ng-container>\n  <ng-container *ngTemplateOutlet=\"textareaInput\"></ng-container>\n  <ng-container *ngTemplateOutlet=\"passwordInput\"></ng-container>\n  <ng-container *ngTemplateOutlet=\"numberInput\"></ng-container>\n  <ng-container *ngTemplateOutlet=\"digitOnlyInput\"></ng-container>\n  <ng-container *ngTemplateOutlet=\"checkboxInput\"></ng-container>\n  <ng-container *ngTemplateOutlet=\"bsnInput\"></ng-container>\n  <ng-container *ngTemplateOutlet=\"presets\"></ng-container>\n</div>\n\n<ng-template #inputTitle>\n  <v-input-label\n    *ngIf=\"title || titleTranslationKey\"\n    [name]=\"name\"\n    [required]=\"required\"\n    [small]=\"smallLabel\"\n    [titleTranslationKey]=\"titleTranslationKey\"\n    [title]=\"title\"\n    [tooltip]=\"tooltip\"\n  >\n  </v-input-label>\n</ng-template>\n\n<ng-template #textInput>\n  <input\n    *ngIf=\"isText\"\n    [ngClass]=\"{\n      'v-input--full-width': fullWidthClass,\n      'v-input--margin': margin && presetOptions.length === 0,\n      'v-input--small-margin': smallMargin && presetOptions.length === 0,\n    }\"\n    [ngModel]=\"inputValue$ | async\"\n    cdsText\n    [attr.data-testid]=\"dataTestId\"\n    [disabled]=\"disabled\"\n    [maxLength]=\"maxLength\"\n    [min]=\"0\"\n    [name]=\"name\"\n    [step]=\"step\"\n    (ngModelChange)=\"onValueChange($event)\"\n    [style.width.px]=\"widthPx\"\n    [placeholder]=\"placeholder\"\n    type=\"text\"\n  />\n</ng-template>\n\n<ng-template #textareaInput>\n  <textarea\n    *ngIf=\"isTextarea\"\n    [ngClass]=\"{\n      'v-input--full-width': fullWidthClass,\n      'v-input--margin': margin,\n      'v-input--small-margin': smallMargin,\n    }\"\n    cdsTextArea\n    [attr.data-testid]=\"dataTestId\"\n    [disabled]=\"disabled\"\n    [name]=\"name\"\n    [ngModel]=\"inputValue$ | async\"\n    [rows]=\"rows\"\n    (ngModelChange)=\"onValueChange($event)\"\n    [style.width.px]=\"widthPx\"\n  ></textarea>\n</ng-template>\n\n<ng-template #passwordInput>\n  <ng-container *ngIf=\"isPassword\">\n    <div\n      *ngIf=\"{showPassword: showPassword$ | async} as obs\"\n      [ngClass]=\"{\n        'v-input--full-width': fullWidthClass,\n        'v-input--margin': margin,\n        'v-input--small-margin': smallMargin,\n      }\"\n      class=\"v-input__password-container\"\n    >\n      <input\n        [ngClass]=\"{\n          'v-input--full-width': fullWidthClass,\n        }\"\n        cdsText\n        [attr.data-testid]=\"dataTestId\"\n        [disabled]=\"disabled\"\n        [maxLength]=\"maxLength\"\n        [min]=\"0\"\n        [name]=\"name\"\n        [ngModel]=\"inputValue$ | async\"\n        [step]=\"step\"\n        (ngModelChange)=\"onValueChange($event)\"\n        [style.width.px]=\"widthPx\"\n        [type]=\"obs.showPassword ? 'text' : 'password'\"\n      />\n\n      <div class=\"v-input__password-icon\">\n        <cds-icon-button align=\"top\" (click)=\"toggleShowPassword()\">\n          <svg cdsIcon=\"{{ obs.showPassword ? 'view-off' : 'view' }}\" size=\"16\"></svg>\n        </cds-icon-button>\n      </div>\n    </div>\n  </ng-container>\n</ng-template>\n\n<ng-template #numberInput>\n  <input\n    *ngIf=\"isNumber\"\n    [ngClass]=\"{\n      'v-input--full-width': fullWidthClass,\n      'v-input--margin': margin,\n      'v-input--small-margin': smallMargin,\n      'v-input--hide-spinbox': hideNumberSpinBox,\n    }\"\n    cdsText\n    [attr.data-testid]=\"dataTestId\"\n    [disabled]=\"disabled\"\n    [maxLength]=\"maxLength\"\n    [min]=\"min\"\n    [name]=\"name\"\n    [ngModel]=\"inputValue$ | async\"\n    [step]=\"step\"\n    (ngModelChange)=\"onValueChange($event)\"\n    [placeholder]=\"placeholder\"\n    [style.width.px]=\"widthPx\"\n    type=\"number\"\n  />\n</ng-template>\n\n<ng-template #digitOnlyInput>\n  <input\n    *ngIf=\"isDigitOnly\"\n    [ngClass]=\"{\n      'v-input--full-width': fullWidthClass,\n      'v-input--margin': margin,\n      'v-input--small-margin': smallMargin,\n    }\"\n    cdsText\n    digitOnly\n    [attr.data-testid]=\"dataTestId\"\n    [disabled]=\"disabled\"\n    [maxLength]=\"maxLength\"\n    [min]=\"0\"\n    [name]=\"name\"\n    [ngModel]=\"inputValue$ | async\"\n    [step]=\"step\"\n    (ngModelChange)=\"onValueChange($event)\"\n    [style.width.px]=\"widthPx\"\n    type=\"text\"\n  />\n</ng-template>\n\n<ng-template #checkboxInput>\n  <div *ngIf=\"isCheckbox\" (click)=\"stopCheckboxEventPropagation($event)\">\n    <cds-checkbox\n      [attr.data-testid]=\"dataTestId\"\n      [disabled]=\"disabled\"\n      [name]=\"name\"\n      [ngModel]=\"inputValue$ | async\"\n      (ngModelChange)=\"onValueChange($event)\"\n    >\n    </cds-checkbox>\n  </div>\n</ng-template>\n\n<ng-template #presets>\n  <div\n    *ngIf=\"isText && presetOptions.length > 0\"\n    [ngClass]=\"{\n      'v-input--margin': margin,\n      'v-input--small-margin': smallMargin,\n    }\"\n    class=\"v-input--preset-options\"\n  >\n    <span>{{ presetsTitle }}:</span>\n\n    @for (preset of presetOptions; track $index) {\n      @if (!$first) {\n        |\n      }\n      <a (click)=\"presetWithValue(preset)\" class=\"v-input--preset-option\">{{ preset }}</a>\n    }\n  </div>\n</ng-template>\n\n<ng-template #bsnInput>\n  <input\n    *ngIf=\"isBsn\"\n    [ngClass]=\"{\n      'v-input--full-width': fullWidthClass,\n      'v-input--margin': margin && presetOptions.length === 0,\n      'v-input--small-margin': smallMargin && presetOptions.length === 0,\n    }\"\n    [ngModel]=\"inputValue$ | async\"\n    cdsText\n    [attr.data-testid]=\"dataTestId\"\n    [disabled]=\"disabled\"\n    [maxLength]=\"'9'\"\n    [min]=\"9\"\n    [name]=\"name\"\n    (ngModelChange)=\"onValueChange($event)\"\n    [style.width.px]=\"widthPx\"\n    [placeholder]=\"placeholder\"\n    type=\"text\"\n  />\n</ng-template>\n", styles: [".full-width{width:100%}.v-input-container{display:flex;flex-direction:column}.v-input__label{margin:0;font-size:var(--v-input-title-font-size);color:var(--v-input-title-font-color);line-height:var(--v-input-title-line-height);font-weight:var(--v-input-title-font-weight);margin-block-end:var(--v-input-title-margin)}.v-input{all:unset;font-size:var(--v-input-font-size);line-height:var(--v-input-line-height);color:var(--v-input-color);font-weight:var(--v-input-font-weight);padding-block-start:var(--v-input-padding-block);padding-block-end:var(--v-input-padding-block);padding-inline-start:var(--v-input-padding-inline);padding-inline-end:var(--v-input-padding-inline);background-color:var(--v-input-bg-color);border-radius:var(--v-input-border-radius);border:var(--v-input-border);transition:var(--v-input-transition);width:var(--v-input-default-width);box-sizing:border-box}.v-input:focus{outline:var(--v-input-focus-border);outline-offset:var(--v-outline-offset)}.v-input:disabled{color:var(--v-input-font-color-disabled);cursor:var(--v-input-disabled-cursor)}.v-input--full-width{width:100%}.v-input--margin{margin-block-end:var(--v-input-margin)}.v-input--small-margin{margin-block-end:var(--v-input-small-margin)}.v-input__password-container{display:flex;flex-direction:row;align-items:center}.v-input__password-icon{margin-inline-start:var(--v-input-password-icon-spacing)}.v-input--hide-spinbox::-webkit-outer-spin-button,.v-input--hide-spinbox::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}.v-input--hide-spinbox{-moz-appearance:textfield}.v-input--checkbox{width:20px;height:20px;margin-block-end:var(--v-input-margin)}div.v-input--preset-options{margin-top:3px;font-size:var(--v-input-font-size);color:var(--v-input-color)}div.v-input--preset-options span:first-child{padding-right:3px}div.v-input--preset-options a.v-input--preset-option{cursor:pointer;font-style:italic}\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.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1$4.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i2.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i2.NumberValueAccessor, selector: "input[type=number][formControlName],input[type=number][formControl],input[type=number][ngModel]" }, { kind: "directive", type: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.MinValidator, selector: "input[type=number][min][formControlName],input[type=number][min][formControl],input[type=number][min][ngModel]", inputs: ["min"] }, { kind: "directive", type: i2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: InputLabelComponent, selector: "v-input-label", inputs: ["name", "tooltip", "tooltipTranslationKey", "largeMargin", "small", "noMargin", "title", "titleTranslationKey", "required", "disabled", "carbonTheme"] }, { kind: "component", type: i2$3.IconButton, selector: "cds-icon-button, ibm-icon-button", inputs: ["buttonNgClass", "buttonAttributes", "buttonId", "kind", "size", "type", "isExpressive", "disabled", "description", "showTooltipWhenDisabled"], outputs: ["click", "focus", "blur", "tooltipClick"] }, { kind: "component", type: i2$3.Checkbox, selector: "cds-checkbox, ibm-checkbox", inputs: ["disabled", "skeleton", "hideLabel", "name", "id", "required", "value", "ariaLabel", "ariaLabelledby", "indeterminate", "checked"], outputs: ["click", "checkedChange", "indeterminateChange"] }, { kind: "directive", type: i2$3.TextInput, selector: "[cdsText], [ibmText]", inputs: ["theme", "size", "invalid", "warn", "skeleton"] }, { kind: "directive", type: i2$3.TextArea, selector: "[cdsTextArea], [ibmTextArea]", inputs: ["theme", "invalid", "skeleton"] }, { kind: "directive", type: i2$3.IconDirective, selector: "[cdsIcon], [ibmIcon]", inputs: ["ibmIcon", "cdsIcon", "size", "title", "ariaLabel", "ariaLabelledBy", "ariaHidden", "isFocusable"] }, { kind: "directive", type: DigitOnlyDirective, selector: "[digitOnly]", inputs: ["decimal", "decimalSeparator", "allowNegatives", "allowPaste", "negativeSign", "min", "max", "pattern"] }, { kind: "pipe", type: i1$4.AsyncPipe, name: "async" }] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.20", ngImport: i0, type: InputComponent, decorators: [{
             type: Component,
             args: [{ selector: 'v-input', 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 class=\"v-input-container\">\n  <ng-container *ngTemplateOutlet=\"inputTitle\"></ng-container>\n  <ng-container *ngTemplateOutlet=\"textInput\"></ng-container>\n  <ng-container *ngTemplateOutlet=\"textareaInput\"></ng-container>\n  <ng-container *ngTemplateOutlet=\"passwordInput\"></ng-container>\n  <ng-container *ngTemplateOutlet=\"numberInput\"></ng-container>\n  <ng-container *ngTemplateOutlet=\"digitOnlyInput\"></ng-container>\n  <ng-container *ngTemplateOutlet=\"checkboxInput\"></ng-container>\n  <ng-container *ngTemplateOutlet=\"bsnInput\"></ng-container>\n  <ng-container *ngTemplateOutlet=\"presets\"></ng-container>\n</div>\n\n<ng-template #inputTitle>\n  <v-input-label\n    *ngIf=\"title || titleTranslationKey\"\n    [name]=\"name\"\n    [required]=\"required\"\n    [small]=\"smallLabel\"\n    [titleTranslationKey]=\"titleTranslationKey\"\n    [title]=\"title\"\n    [tooltip]=\"tooltip\"\n  >\n  </v-input-label>\n</ng-template>\n\n<ng-template #textInput>\n  <input\n    *ngIf=\"isText\"\n    [ngClass]=\"{\n      'v-input--full-width': fullWidthClass,\n      'v-input--margin': margin && presetOptions.length === 0,\n      'v-input--small-margin': smallMargin && presetOptions.length === 0,\n    }\"\n    [ngModel]=\"inputValue$ | async\"\n    cdsText\n    [attr.data-testid]=\"dataTestId\"\n    [disabled]=\"disabled\"\n    [maxLength]=\"maxLength\"\n    [min]=\"0\"\n    [name]=\"name\"\n    [step]=\"step\"\n    (ngModelChange)=\"onValueChange($event)\"\n    [style.width.px]=\"widthPx\"\n    [placeholder]=\"placeholder\"\n    type=\"text\"\n  />\n</ng-template>\n\n<ng-template #textareaInput>\n  <textarea\n    *ngIf=\"isTextarea\"\n    [ngClass]=\"{\n      'v-input--full-width': fullWidthClass,\n      'v-input--margin': margin,\n      'v-input--small-margin': smallMargin,\n    }\"\n    cdsTextArea\n    [attr.data-testid]=\"dataTestId\"\n    [disabled]=\"disabled\"\n    [name]=\"name\"\n    [ngModel]=\"inputValue$ | async\"\n    [rows]=\"rows\"\n    (ngModelChange)=\"onValueChange($event)\"\n    [style.width.px]=\"widthPx\"\n  ></textarea>\n</ng-template>\n\n<ng-template #passwordInput>\n  <ng-container *ngIf=\"isPassword\">\n    <div\n      *ngIf=\"{showPassword: showPassword$ | async} as obs\"\n      [ngClass]=\"{\n        'v-input--full-width': fullWidthClass,\n        'v-input--margin': margin,\n        'v-input--small-margin': smallMargin,\n      }\"\n      class=\"v-input__password-container\"\n    >\n      <input\n        [ngClass]=\"{\n          'v-input--full-width': fullWidthClass,\n        }\"\n        cdsText\n        [attr.data-testid]=\"dataTestId\"\n        [disabled]=\"disabled\"\n        [maxLength]=\"maxLength\"\n        [min]=\"0\"\n        [name]=\"name\"\n        [ngModel]=\"inputValue$ | async\"\n        [step]=\"step\"\n        (ngModelChange)=\"onValueChange($event)\"\n        [style.width.px]=\"widthPx\"\n        [type]=\"obs.showPassword ? 'text' : 'password'\"\n      />\n\n      <div class=\"v-input__password-icon\">\n        <cds-icon-button align=\"top\" (click)=\"toggleShowPassword()\">\n          <svg cdsIcon=\"{{ obs.showPassword ? 'view-off' : 'view' }}\" size=\"16\"></svg>\n        </cds-icon-button>\n      </div>\n    </div>\n  </ng-container>\n</ng-template>\n\n<ng-template #numberInput>\n  <input\n    *ngIf=\"isNumber\"\n    [ngClass]=\"{\n      'v-input--full-width': fullWidthClass,\n      'v-input--margin': margin,\n      'v-input--small-margin': smallMargin,\n      'v-input--hide-spinbox': hideNumberSpinBox,\n    }\"\n    cdsText\n    [attr.data-testid]=\"dataTestId\"\n    [disabled]=\"disabled\"\n    [maxLength]=\"maxLength\"\n    [min]=\"min\"\n    [name]=\"name\"\n    [ngModel]=\"inputValue$ | async\"\n    [step]=\"step\"\n    (ngModelChange)=\"onValueChange($event)\"\n    [placeholder]=\"placeholder\"\n    [style.width.px]=\"widthPx\"\n    type=\"number\"\n  />\n</ng-template>\n\n<ng-template #digitOnlyInput>\n  <input\n    *ngIf=\"isDigitOnly\"\n    [ngClass]=\"{\n      'v-input--full-width': fullWidthClass,\n      'v-input--margin': margin,\n      'v-input--small-margin': smallMargin,\n    }\"\n    cdsText\n    digitOnly\n    [attr.data-testid]=\"dataTestId\"\n    [disabled]=\"disabled\"\n    [maxLength]=\"maxLength\"\n    [min]=\"0\"\n    [name]=\"name\"\n    [ngModel]=\"inputValue$ | async\"\n    [step]=\"step\"\n    (ngModelChange)=\"onValueChange($event)\"\n    [style.width.px]=\"widthPx\"\n    type=\"text\"\n  />\n</ng-template>\n\n<ng-template #checkboxInput>\n  <div *ngIf=\"isCheckbox\" (click)=\"stopCheckboxEventPropagation($event)\">\n    <cds-checkbox\n      [attr.data-testid]=\"dataTestId\"\n      [disabled]=\"disabled\"\n      [name]=\"name\"\n      [ngModel]=\"inputValue$ | async\"\n      (ngModelChange)=\"onValueChange($event)\"\n    >\n    </cds-checkbox>\n  </div>\n</ng-template>\n\n<ng-template #presets>\n  <div\n    *ngIf=\"isText && presetOptions.length > 0\"\n    [ngClass]=\"{\n      'v-input--margin': margin,\n      'v-input--small-margin': smallMargin,\n    }\"\n    class=\"v-input--preset-options\"\n  >\n    <span>{{ presetsTitle }}:</span>\n\n    @for (preset of presetOptions; track $index) {\n      @if (!$first) {\n        |\n      }\n      <a (click)=\"presetWithValue(preset)\" class=\"v-input--preset-option\">{{ preset }}</a>\n    }\n  </div>\n</ng-template>\n\n<ng-template #bsnInput>\n  <input\n    *ngIf=\"isBsn\"\n    [ngClass]=\"{\n      'v-input--full-width': fullWidthClass,\n      'v-input--margin': margin && presetOptions.length === 0,\n      'v-input--small-margin': smallMargin && presetOptions.length === 0,\n    }\"\n    [ngModel]=\"inputValue$ | async\"\n    cdsText\n    [attr.data-testid]=\"dataTestId\"\n    [disabled]=\"disabled\"\n    [maxLength]=\"'9'\"\n    [min]=\"9\"\n    [name]=\"name\"\n    (ngModelChange)=\"onValueChange($event)\"\n    [style.width.px]=\"widthPx\"\n    [placeholder]=\"placeholder\"\n    type=\"text\"\n  />\n</ng-template>\n", styles: [".full-width{width:100%}.v-input-container{display:flex;flex-direction:column}.v-input__label{margin:0;font-size:var(--v-input-title-font-size);color:var(--v-input-title-font-color);line-height:var(--v-input-title-line-height);font-weight:var(--v-input-title-font-weight);margin-block-end:var(--v-input-title-margin)}.v-input{all:unset;font-size:var(--v-input-font-size);line-height:var(--v-input-line-height);color:var(--v-input-color);font-weight:var(--v-input-font-weight);padding-block-start:var(--v-input-padding-block);padding-block-end:var(--v-input-padding-block);padding-inline-start:var(--v-input-padding-inline);padding-inline-end:var(--v-input-padding-inline);background-color:var(--v-input-bg-color);border-radius:var(--v-input-border-radius);border:var(--v-input-border);transition:var(--v-input-transition);width:var(--v-input-default-width);box-sizing:border-box}.v-input:focus{outline:var(--v-input-focus-border);outline-offset:var(--v-outline-offset)}.v-input:disabled{color:var(--v-input-font-color-disabled);cursor:var(--v-input-disabled-cursor)}.v-input--full-width{width:100%}.v-input--margin{margin-block-end:var(--v-input-margin)}.v-input--small-margin{margin-block-end:var(--v-input-small-margin)}.v-input__password-container{display:flex;flex-direction:row;align-items:center}.v-input__password-icon{margin-inline-start:var(--v-input-password-icon-spacing)}.v-input--hide-spinbox::-webkit-outer-spin-button,.v-input--hide-spinbox::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}.v-input--hide-spinbox{-moz-appearance:textfield}.v-input--checkbox{width:20px;height:20px;margin-block-end:var(--v-input-margin)}div.v-input--preset-options{margin-top:3px;font-size:var(--v-input-font-size);color:var(--v-input-color)}div.v-input--preset-options span:first-child{padding-right:3px}div.v-input--preset-options a.v-input--preset-option{cursor:pointer;font-style:italic}\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: i2$2.IconService }], propDecorators: { fullWidthClass: [{
+        }], ctorParameters: () => [{ type: i2$3.IconService }], propDecorators: { fullWidthClass: [{
                 type: HostBinding,
                 args: ['class.full-width']
             }], name: [{
@@ -12303,7 +12476,7 @@ class SelectComponent {
                 useExisting: forwardRef(() => SelectComponent),
                 multi: true,
             },
-        ], 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  *ngIf=\"{\n    placeholderText: placeholder || ('interface.filter' | translate),\n    loadingText: loadingText || ('interface.loading' | translate),\n    clearText: clearText || ('interface.clear' | translate),\n    clearAllText: clearAllText || ('interface.clearAll' | translate),\n    notFoundText: notFoundText || ('interface.noItemsFound' | translate),\n    items: listItems$ | async,\n  } as vars\"\n  class=\"v-select-container\"\n  [ngClass]=\"{\n    'v-select-container--margin': margin,\n    'v-select-container--small-margin': smallMargin,\n    'v-select-container--not-clearable': !clearable,\n  }\"\n  [style.width.px]=\"widthInPx\"\n>\n  <v-input-label\n    *ngIf=\"title || titleTranslationKey\"\n    [name]=\"name\"\n    [required]=\"required\"\n    [titleTranslationKey]=\"titleTranslationKey\"\n    [title]=\"title\"\n    [tooltip]=\"tooltip\"\n  >\n  </v-input-label>\n\n  <cds-combo-box\n    [attr.data-testid]=\"dataTestId\"\n    [appendInline]=\"appendInline\"\n    [clearSelectionTitle]=\"vars.clearText\"\n    [clearSelectionsTitle]=\"vars.clearAllText\"\n    [disabled]=\"$disabled() || loading || (vars?.items || []).length === 0\"\n    [dropUp]=\"dropUp\"\n    [invalid]=\"invalid\"\n    [placeholder]=\"\n      loading\n        ? vars.loadingText\n        : (vars?.items || []).length === 0\n          ? vars.notFoundText\n          : vars.placeholderText\n    \"\n    [type]=\"multiple ? 'multi' : 'single'\"\n    [warn]=\"warn\"\n    [warnText]=\"warnText\"\n    (clear)=\"clear()\"\n    (selected)=\"setSelected($event)\"\n  >\n    <cds-dropdown-list [items]=\"vars?.items || []\"></cds-dropdown-list>\n  </cds-combo-box>\n</div>\n", styles: [".v-select-container--margin{margin-block-end:var(--v-input-margin)}.v-select-container--small-margin{margin-block-end:var(--v-input-small-margin)}.v-select-container--not-clearable .cds--list-box.cds--combo-box .cds--list-box__field>.cds--list-box__selection{display:none!important}\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.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: InputLabelComponent, selector: "v-input-label", inputs: ["name", "tooltip", "tooltipTranslationKey", "largeMargin", "small", "noMargin", "title", "titleTranslationKey", "required", "disabled", "carbonTheme"] }, { kind: "component", type: i2$2.ComboBox, selector: "cds-combo-box, ibm-combo-box", inputs: ["placeholder", "openMenuAria", "closeMenuAria", "clearSelectionsTitle", "clearSelectionsAria", "clearSelectionTitle", "clearSelectionAria", "id", "labelId", "items", "type", "size", "itemValueKey", "label", "hideLabel", "helperText", "appendInline", "invalid", "invalidText", "warn", "warnText", "maxLength", "theme", "selectionFeedback", "autocomplete", "dropUp", "disabled", "readonly", "fluid"], outputs: ["selected", "submit", "close", "search", "clear"] }, { kind: "component", type: i2$2.DropdownList, selector: "cds-dropdown-list, ibm-dropdown-list", inputs: ["ariaLabel", "items", "listTpl", "type", "showTitles"], outputs: ["select", "scroll", "blurIntent"] }, { kind: "pipe", type: i1$4.AsyncPipe, name: "async" }, { kind: "pipe", type: i1.TranslatePipe, name: "translate" }], encapsulation: i0.ViewEncapsulation.None }); }
+        ], 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  *ngIf=\"{\n    placeholderText: placeholder || ('interface.filter' | translate),\n    loadingText: loadingText || ('interface.loading' | translate),\n    clearText: clearText || ('interface.clear' | translate),\n    clearAllText: clearAllText || ('interface.clearAll' | translate),\n    notFoundText: notFoundText || ('interface.noItemsFound' | translate),\n    items: listItems$ | async,\n  } as vars\"\n  class=\"v-select-container\"\n  [ngClass]=\"{\n    'v-select-container--margin': margin,\n    'v-select-container--small-margin': smallMargin,\n    'v-select-container--not-clearable': !clearable,\n  }\"\n  [style.width.px]=\"widthInPx\"\n>\n  <v-input-label\n    *ngIf=\"title || titleTranslationKey\"\n    [name]=\"name\"\n    [required]=\"required\"\n    [titleTranslationKey]=\"titleTranslationKey\"\n    [title]=\"title\"\n    [tooltip]=\"tooltip\"\n  >\n  </v-input-label>\n\n  <cds-combo-box\n    [attr.data-testid]=\"dataTestId\"\n    [appendInline]=\"appendInline\"\n    [clearSelectionTitle]=\"vars.clearText\"\n    [clearSelectionsTitle]=\"vars.clearAllText\"\n    [disabled]=\"$disabled() || loading || (vars?.items || []).length === 0\"\n    [dropUp]=\"dropUp\"\n    [invalid]=\"invalid\"\n    [placeholder]=\"\n      loading\n        ? vars.loadingText\n        : (vars?.items || []).length === 0\n          ? vars.notFoundText\n          : vars.placeholderText\n    \"\n    [type]=\"multiple ? 'multi' : 'single'\"\n    [warn]=\"warn\"\n    [warnText]=\"warnText\"\n    (clear)=\"clear()\"\n    (selected)=\"setSelected($event)\"\n  >\n    <cds-dropdown-list [items]=\"vars?.items || []\"></cds-dropdown-list>\n  </cds-combo-box>\n</div>\n", styles: [".v-select-container--margin{margin-block-end:var(--v-input-margin)}.v-select-container--small-margin{margin-block-end:var(--v-input-small-margin)}.v-select-container--not-clearable .cds--list-box.cds--combo-box .cds--list-box__field>.cds--list-box__selection{display:none!important}\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.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: InputLabelComponent, selector: "v-input-label", inputs: ["name", "tooltip", "tooltipTranslationKey", "largeMargin", "small", "noMargin", "title", "titleTranslationKey", "required", "disabled", "carbonTheme"] }, { kind: "component", type: i2$3.ComboBox, selector: "cds-combo-box, ibm-combo-box", inputs: ["placeholder", "openMenuAria", "closeMenuAria", "clearSelectionsTitle", "clearSelectionsAria", "clearSelectionTitle", "clearSelectionAria", "id", "labelId", "items", "type", "size", "itemValueKey", "label", "hideLabel", "helperText", "appendInline", "invalid", "invalidText", "warn", "warnText", "maxLength", "theme", "selectionFeedback", "autocomplete", "dropUp", "disabled", "readonly", "fluid"], outputs: ["selected", "submit", "close", "search", "clear"] }, { kind: "component", type: i2$3.DropdownList, selector: "cds-dropdown-list, ibm-dropdown-list", inputs: ["ariaLabel", "items", "listTpl", "type", "showTitles"], outputs: ["select", "scroll", "blurIntent"] }, { kind: "pipe", type: i1$4.AsyncPipe, name: "async" }, { kind: "pipe", type: i1.TranslatePipe, name: "translate" }], encapsulation: i0.ViewEncapsulation.None }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.20", ngImport: i0, type: SelectComponent, decorators: [{
             type: Component,
@@ -12404,7 +12577,7 @@ class KeyValueComponent {
         this.valueChange.emit({ value: this.value, inputValue, type });
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.20", ngImport: i0, type: KeyValueComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.20", type: KeyValueComponent, isStandalone: true, selector: "valtimo-key-value", inputs: { keyColumnTitle: "keyColumnTitle", valueColumnTitle: "valueColumnTitle", index: "index", value: "value", fullWidth: "fullWidth", disabled: "disabled", keyColumnFlex: "keyColumnFlex", valueColumnFlex: "valueColumnFlex" }, outputs: { valueChange: "valueChange" }, host: { properties: { "class.--full-width": "this.fullWidth" } }, 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=\"v-multi-input__input\"\n  [ngClass]=\"{'--full-width': fullWidth}\"\n  [style.flex]=\"keyColumnFlex\"\n>\n  <cds-label *ngIf=\"index === 0 && keyColumnTitle\">{{ keyColumnTitle }}</cds-label>\n\n  <input\n    cdsText\n    cdsLayer\n    [defaultValue]=\"value.key\"\n    [disabled]=\"disabled\"\n    (input)=\"onInputChange('key', $event.target.value)\"\n    [attr.data-test-id]=\"testIds.keyInput\"\n  />\n</div>\n\n<div class=\"v-multi-input__separator\"></div>\n\n<div\n  class=\"v-multi-input__input\"\n  [ngClass]=\"{'--full-width': fullWidth}\"\n  [style.flex]=\"valueColumnFlex\"\n>\n  <cds-label *ngIf=\"index === 0 && valueColumnTitle\">{{ valueColumnTitle }}</cds-label>\n\n  <input\n    cdsText\n    cdsLayer\n    [defaultValue]=\"value.value\"\n    [disabled]=\"disabled\"\n    (input)=\"onInputChange('value', $event.target.value)\"\n    [attr.data-test-id]=\"testIds.valueInput\"\n  />\n</div>\n", styles: [":host{display:flex;flex-direction:row;align-items:flex-end}:host.--full-width{width:100%}\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: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$4.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1$4.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "ngmodule", type: InputModule$1 }, { kind: "component", type: i2$2.Label, selector: "cds-label, ibm-label", inputs: ["labelInputID", "disabled", "skeleton", "helperText", "invalidText", "invalid", "warn", "warnText", "ariaLabel"] }, { kind: "directive", type: i2$2.TextInput, selector: "[cdsText], [ibmText]", inputs: ["theme", "size", "invalid", "warn", "skeleton"] }, { kind: "ngmodule", type: LayerModule }, { kind: "directive", type: i2$2.LayerDirective, selector: "[cdsLayer], [ibmLayer]", inputs: ["ibmLayer", "cdsLayer"], exportAs: ["layer"] }] }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.20", type: KeyValueComponent, isStandalone: true, selector: "valtimo-key-value", inputs: { keyColumnTitle: "keyColumnTitle", valueColumnTitle: "valueColumnTitle", index: "index", value: "value", fullWidth: "fullWidth", disabled: "disabled", keyColumnFlex: "keyColumnFlex", valueColumnFlex: "valueColumnFlex" }, outputs: { valueChange: "valueChange" }, host: { properties: { "class.--full-width": "this.fullWidth" } }, 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=\"v-multi-input__input\"\n  [ngClass]=\"{'--full-width': fullWidth}\"\n  [style.flex]=\"keyColumnFlex\"\n>\n  <cds-label *ngIf=\"index === 0 && keyColumnTitle\">{{ keyColumnTitle }}</cds-label>\n\n  <input\n    cdsText\n    cdsLayer\n    [defaultValue]=\"value.key\"\n    [disabled]=\"disabled\"\n    (input)=\"onInputChange('key', $event.target.value)\"\n    [attr.data-test-id]=\"testIds.keyInput\"\n  />\n</div>\n\n<div class=\"v-multi-input__separator\"></div>\n\n<div\n  class=\"v-multi-input__input\"\n  [ngClass]=\"{'--full-width': fullWidth}\"\n  [style.flex]=\"valueColumnFlex\"\n>\n  <cds-label *ngIf=\"index === 0 && valueColumnTitle\">{{ valueColumnTitle }}</cds-label>\n\n  <input\n    cdsText\n    cdsLayer\n    [defaultValue]=\"value.value\"\n    [disabled]=\"disabled\"\n    (input)=\"onInputChange('value', $event.target.value)\"\n    [attr.data-test-id]=\"testIds.valueInput\"\n  />\n</div>\n", styles: [":host{display:flex;flex-direction:row;align-items:flex-end}:host.--full-width{width:100%}\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: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$4.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1$4.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "ngmodule", type: InputModule$1 }, { kind: "component", type: i2$3.Label, selector: "cds-label, ibm-label", inputs: ["labelInputID", "disabled", "skeleton", "helperText", "invalidText", "invalid", "warn", "warnText", "ariaLabel"] }, { kind: "directive", type: i2$3.TextInput, selector: "[cdsText], [ibmText]", inputs: ["theme", "size", "invalid", "warn", "skeleton"] }, { kind: "ngmodule", type: LayerModule }, { kind: "directive", type: i2$3.LayerDirective, selector: "[cdsLayer], [ibmLayer]", inputs: ["ibmLayer", "cdsLayer"], exportAs: ["layer"] }] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.20", ngImport: i0, type: KeyValueComponent, decorators: [{
             type: Component,
@@ -12458,7 +12631,7 @@ class SingleValueComponent {
         this.valueChange.emit({ value: this.value, inputValue });
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.20", ngImport: i0, type: SingleValueComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.20", type: SingleValueComponent, isStandalone: true, selector: "valtimo-single-value", inputs: { value: "value", fullWidth: "fullWidth", disabled: "disabled" }, outputs: { valueChange: "valueChange" }, host: { properties: { "class.--full-width": "this.fullWidth" } }, 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 class=\"v-multi-input__input\" [ngClass]=\"{'--full-width': fullWidth}\">\n  <input\n    cdsText\n    [defaultValue]=\"value?.value\"\n    [disabled]=\"disabled\"\n    (input)=\"onInputChange($event.target.value)\"\n    [attr.data-test-id]=\"testIds.input\"\n  />\n</div>\n", styles: [":host{display:flex;flex-direction:row;align-items:flex-end}:host.--full-width{width:100%}\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: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$4.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "ngmodule", type: InputModule$1 }, { kind: "directive", type: i2$2.TextInput, selector: "[cdsText], [ibmText]", inputs: ["theme", "size", "invalid", "warn", "skeleton"] }] }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.20", type: SingleValueComponent, isStandalone: true, selector: "valtimo-single-value", inputs: { value: "value", fullWidth: "fullWidth", disabled: "disabled" }, outputs: { valueChange: "valueChange" }, host: { properties: { "class.--full-width": "this.fullWidth" } }, 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 class=\"v-multi-input__input\" [ngClass]=\"{'--full-width': fullWidth}\">\n  <input\n    cdsText\n    [defaultValue]=\"value?.value\"\n    [disabled]=\"disabled\"\n    (input)=\"onInputChange($event.target.value)\"\n    [attr.data-test-id]=\"testIds.input\"\n  />\n</div>\n", styles: [":host{display:flex;flex-direction:row;align-items:flex-end}:host.--full-width{width:100%}\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: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$4.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "ngmodule", type: InputModule$1 }, { kind: "directive", type: i2$3.TextInput, selector: "[cdsText], [ibmText]", inputs: ["theme", "size", "invalid", "warn", "skeleton"] }] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.20", ngImport: i0, type: SingleValueComponent, decorators: [{
             type: Component,
@@ -12506,7 +12679,7 @@ class KeyDropdownValueComponent {
         this.valueChange.emit({ value: this.value, inputValue, type });
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.20", ngImport: i0, type: KeyDropdownValueComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.20", type: KeyDropdownValueComponent, isStandalone: true, selector: "valtimo-key-dropdown-value", inputs: { keyColumnTitle: "keyColumnTitle", valueColumnTitle: "valueColumnTitle", dropdownColumnTitle: "dropdownColumnTitle", index: "index", value: "value", dropdownItems$: "dropdownItems$", dropdownWidth: "dropdownWidth", fullWidth: "fullWidth", disabled: "disabled", keyColumnFlex: "keyColumnFlex", dropdownColumnFlex: "dropdownColumnFlex", valueColumnFlex: "valueColumnFlex" }, outputs: { valueChange: "valueChange" }, host: { properties: { "class.--full-width": "this.fullWidth" } }, 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=\"v-multi-input__input\"\n  [ngClass]=\"{'--full-width': fullWidth}\"\n  [style.flex]=\"keyColumnFlex\"\n>\n  <cds-label *ngIf=\"index === 0 && keyColumnTitle\">{{ keyColumnTitle }}</cds-label>\n\n  <input\n    cdsText\n    [defaultValue]=\"value.key\"\n    [disabled]=\"disabled\"\n    (input)=\"onInputChange('key', $event.target.value)\"\n    [attr.data-test-id]=\"testIds.keyInput\"\n  />\n</div>\n\n<div class=\"v-multi-input__separator\"></div>\n\n<div\n  class=\"v-multi-input__input\"\n  [ngClass]=\"{'--full-width': fullWidth}\"\n  [style.minWidth.px]=\"dropdownWidth\"\n  [style.flex]=\"dropdownColumnFlex\"\n>\n  <cds-label *ngIf=\"index === 0 && dropdownColumnTitle\">{{ dropdownColumnTitle }}</cds-label>\n\n  <cds-dropdown\n    [dropUp]=\"false\"\n    (selected)=\"onInputChange('dropdown', $event.item.id)\"\n    [appendInline]=\"true\"\n    [attr.data-test-id]=\"testIds.dropdown\"\n  >\n    <cds-dropdown-list [items]=\"dropdownItems$ | async\" type=\"multi\"></cds-dropdown-list>\n  </cds-dropdown>\n</div>\n\n<div class=\"v-multi-input__separator\"></div>\n\n<div\n  class=\"v-multi-input__input\"\n  [ngClass]=\"{'--full-width': fullWidth}\"\n  [style.flex]=\"valueColumnFlex\"\n>\n  <cds-label *ngIf=\"index === 0 && valueColumnTitle\">{{ valueColumnTitle }}</cds-label>\n\n  <input\n    cdsText\n    [defaultValue]=\"value.value\"\n    [disabled]=\"disabled\"\n    (input)=\"onInputChange('value', $event.target.value)\"\n    [attr.data-test-id]=\"testIds.valueInput\"\n  />\n</div>\n", styles: [":host{display:flex;flex-direction:row;align-items:flex-end}:host.--full-width{width:100%}\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: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$4.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1$4.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "pipe", type: i1$4.AsyncPipe, name: "async" }, { kind: "ngmodule", type: InputModule$1 }, { kind: "component", type: i2$2.Label, selector: "cds-label, ibm-label", inputs: ["labelInputID", "disabled", "skeleton", "helperText", "invalidText", "invalid", "warn", "warnText", "ariaLabel"] }, { kind: "directive", type: i2$2.TextInput, selector: "[cdsText], [ibmText]", inputs: ["theme", "size", "invalid", "warn", "skeleton"] }, { kind: "ngmodule", type: DropdownModule }, { kind: "component", type: i2$2.Dropdown, selector: "cds-dropdown, ibm-dropdown", inputs: ["id", "label", "hideLabel", "helperText", "placeholder", "displayValue", "clearText", "size", "type", "theme", "disabled", "readonly", "skeleton", "inline", "disableArrowKeys", "invalid", "invalidText", "warn", "warnText", "appendInline", "scrollableContainer", "itemValueKey", "selectionFeedback", "menuButtonLabel", "selectedLabel", "dropUp", "fluid"], outputs: ["selected", "onClose", "close"] }, { kind: "component", type: i2$2.DropdownList, selector: "cds-dropdown-list, ibm-dropdown-list", inputs: ["ariaLabel", "items", "listTpl", "type", "showTitles"], outputs: ["select", "scroll", "blurIntent"] }] }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.20", type: KeyDropdownValueComponent, isStandalone: true, selector: "valtimo-key-dropdown-value", inputs: { keyColumnTitle: "keyColumnTitle", valueColumnTitle: "valueColumnTitle", dropdownColumnTitle: "dropdownColumnTitle", index: "index", value: "value", dropdownItems$: "dropdownItems$", dropdownWidth: "dropdownWidth", fullWidth: "fullWidth", disabled: "disabled", keyColumnFlex: "keyColumnFlex", dropdownColumnFlex: "dropdownColumnFlex", valueColumnFlex: "valueColumnFlex" }, outputs: { valueChange: "valueChange" }, host: { properties: { "class.--full-width": "this.fullWidth" } }, 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=\"v-multi-input__input\"\n  [ngClass]=\"{'--full-width': fullWidth}\"\n  [style.flex]=\"keyColumnFlex\"\n>\n  <cds-label *ngIf=\"index === 0 && keyColumnTitle\">{{ keyColumnTitle }}</cds-label>\n\n  <input\n    cdsText\n    [defaultValue]=\"value.key\"\n    [disabled]=\"disabled\"\n    (input)=\"onInputChange('key', $event.target.value)\"\n    [attr.data-test-id]=\"testIds.keyInput\"\n  />\n</div>\n\n<div class=\"v-multi-input__separator\"></div>\n\n<div\n  class=\"v-multi-input__input\"\n  [ngClass]=\"{'--full-width': fullWidth}\"\n  [style.minWidth.px]=\"dropdownWidth\"\n  [style.flex]=\"dropdownColumnFlex\"\n>\n  <cds-label *ngIf=\"index === 0 && dropdownColumnTitle\">{{ dropdownColumnTitle }}</cds-label>\n\n  <cds-dropdown\n    [dropUp]=\"false\"\n    (selected)=\"onInputChange('dropdown', $event.item.id)\"\n    [appendInline]=\"true\"\n    [attr.data-test-id]=\"testIds.dropdown\"\n  >\n    <cds-dropdown-list [items]=\"dropdownItems$ | async\" type=\"multi\"></cds-dropdown-list>\n  </cds-dropdown>\n</div>\n\n<div class=\"v-multi-input__separator\"></div>\n\n<div\n  class=\"v-multi-input__input\"\n  [ngClass]=\"{'--full-width': fullWidth}\"\n  [style.flex]=\"valueColumnFlex\"\n>\n  <cds-label *ngIf=\"index === 0 && valueColumnTitle\">{{ valueColumnTitle }}</cds-label>\n\n  <input\n    cdsText\n    [defaultValue]=\"value.value\"\n    [disabled]=\"disabled\"\n    (input)=\"onInputChange('value', $event.target.value)\"\n    [attr.data-test-id]=\"testIds.valueInput\"\n  />\n</div>\n", styles: [":host{display:flex;flex-direction:row;align-items:flex-end}:host.--full-width{width:100%}\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: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$4.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1$4.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "pipe", type: i1$4.AsyncPipe, name: "async" }, { kind: "ngmodule", type: InputModule$1 }, { kind: "component", type: i2$3.Label, selector: "cds-label, ibm-label", inputs: ["labelInputID", "disabled", "skeleton", "helperText", "invalidText", "invalid", "warn", "warnText", "ariaLabel"] }, { kind: "directive", type: i2$3.TextInput, selector: "[cdsText], [ibmText]", inputs: ["theme", "size", "invalid", "warn", "skeleton"] }, { kind: "ngmodule", type: DropdownModule }, { kind: "component", type: i2$3.Dropdown, selector: "cds-dropdown, ibm-dropdown", inputs: ["id", "label", "hideLabel", "helperText", "placeholder", "displayValue", "clearText", "size", "type", "theme", "disabled", "readonly", "skeleton", "inline", "disableArrowKeys", "invalid", "invalidText", "warn", "warnText", "appendInline", "scrollableContainer", "itemValueKey", "selectionFeedback", "menuButtonLabel", "selectedLabel", "dropUp", "fluid"], outputs: ["selected", "onClose", "close"] }, { kind: "component", type: i2$3.DropdownList, selector: "cds-dropdown-list, ibm-dropdown-list", inputs: ["ariaLabel", "items", "listTpl", "type", "showTitles"], outputs: ["select", "scroll", "blurIntent"] }] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.20", ngImport: i0, type: KeyDropdownValueComponent, decorators: [{
             type: Component,
@@ -12576,7 +12749,7 @@ class ArbitraryAmountValueComponent {
         });
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.20", ngImport: i0, type: ArbitraryAmountValueComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.20", type: ArbitraryAmountValueComponent, isStandalone: true, selector: "valtimo-arbitrary-amount-value", inputs: { index: "index", value: "value", fullWidth: "fullWidth", disabled: "disabled", arbitraryAmountTitles: "arbitraryAmountTitles", amountOfArbitraryValuesArray$: "amountOfArbitraryValuesArray$" }, outputs: { valueChange: "valueChange" }, host: { properties: { "class.--full-width": "this.isFullWidth" } }, 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@for (_ of amountOfArbitraryValuesArray$ | async; let i = $index; track i) {\n  <div class=\"v-multi-input__input\" [ngClass]=\"{'--full-width': fullWidth}\">\n    <cds-label *ngIf=\"index === 0\">{{\n      arbitraryAmountTitles ? arbitraryAmountTitles[i] : ''\n    }}</cds-label>\n\n    <input\n      cdsText\n      [defaultValue]=\"value ? value['' + i] : ''\"\n      [disabled]=\"disabled\"\n      (input)=\"onInputChange(i, $event.target.value)\"\n      [attr.data-test-id]=\"testIds.input\"\n    />\n  </div>\n\n  @if (((amountOfArbitraryValuesArray$ | async) || []).length - 1 !== i) {\n    <div class=\"v-multi-input__separator\"></div>\n  }\n}\n", styles: [":host{display:flex;flex-direction:row;align-items:flex-end}:host.--full-width{width:100%}:host .process-start-modal-content{padding:16px}\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: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$4.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1$4.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "pipe", type: i1$4.AsyncPipe, name: "async" }, { kind: "ngmodule", type: InputModule$1 }, { kind: "component", type: i2$2.Label, selector: "cds-label, ibm-label", inputs: ["labelInputID", "disabled", "skeleton", "helperText", "invalidText", "invalid", "warn", "warnText", "ariaLabel"] }, { kind: "directive", type: i2$2.TextInput, selector: "[cdsText], [ibmText]", inputs: ["theme", "size", "invalid", "warn", "skeleton"] }] }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.20", type: ArbitraryAmountValueComponent, isStandalone: true, selector: "valtimo-arbitrary-amount-value", inputs: { index: "index", value: "value", fullWidth: "fullWidth", disabled: "disabled", arbitraryAmountTitles: "arbitraryAmountTitles", amountOfArbitraryValuesArray$: "amountOfArbitraryValuesArray$" }, outputs: { valueChange: "valueChange" }, host: { properties: { "class.--full-width": "this.isFullWidth" } }, 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@for (_ of amountOfArbitraryValuesArray$ | async; let i = $index; track i) {\n  <div class=\"v-multi-input__input\" [ngClass]=\"{'--full-width': fullWidth}\">\n    <cds-label *ngIf=\"index === 0\">{{\n      arbitraryAmountTitles ? arbitraryAmountTitles[i] : ''\n    }}</cds-label>\n\n    <input\n      cdsText\n      [defaultValue]=\"value ? value['' + i] : ''\"\n      [disabled]=\"disabled\"\n      (input)=\"onInputChange(i, $event.target.value)\"\n      [attr.data-test-id]=\"testIds.input\"\n    />\n  </div>\n\n  @if (((amountOfArbitraryValuesArray$ | async) || []).length - 1 !== i) {\n    <div class=\"v-multi-input__separator\"></div>\n  }\n}\n", styles: [":host{display:flex;flex-direction:row;align-items:flex-end}:host.--full-width{width:100%}:host .process-start-modal-content{padding:16px}\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: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$4.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1$4.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "pipe", type: i1$4.AsyncPipe, name: "async" }, { kind: "ngmodule", type: InputModule$1 }, { kind: "component", type: i2$3.Label, selector: "cds-label, ibm-label", inputs: ["labelInputID", "disabled", "skeleton", "helperText", "invalidText", "invalid", "warn", "warnText", "ariaLabel"] }, { kind: "directive", type: i2$3.TextInput, selector: "[cdsText], [ibmText]", inputs: ["theme", "size", "invalid", "warn", "skeleton"] }] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.20", ngImport: i0, type: ArbitraryAmountValueComponent, decorators: [{
             type: Component,
@@ -12648,7 +12821,7 @@ class KeyValuePathSelectorComponent {
         this.valueChange.emit({ value: this.value, inputValue, type });
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.20", ngImport: i0, type: KeyValuePathSelectorComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.20", type: KeyValuePathSelectorComponent, isStandalone: true, selector: "valtimo-key-value-path-selector", inputs: { keyColumnTitle: "keyColumnTitle", valueColumnTitle: "valueColumnTitle", index: "index", value: "value", fullWidth: "fullWidth", disabled: "disabled", caseDefinitionKey: "caseDefinitionKey", prefixes: "prefixes", showCaseDefinitionSelector: "showCaseDefinitionSelector", notation: "notation", keyColumnFlex: "keyColumnFlex", valueColumnFlex: "valueColumnFlex" }, outputs: { valueChange: "valueChange" }, host: { properties: { "class.--full-width": "this.fullWidth" } }, 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=\"v-multi-input__input key\"\n  [ngClass]=\"{'--full-width': fullWidth}\"\n  [style.flex]=\"keyColumnFlex\"\n>\n  <cds-label *ngIf=\"index === 0 && keyColumnTitle\">{{ keyColumnTitle }}</cds-label>\n\n  <input\n    cdsText\n    [defaultValue]=\"value.key\"\n    [disabled]=\"disabled\"\n    (input)=\"onInputChange('key', $event.target.value)\"\n    [attr.data-test-id]=\"testIds.keyInput\"\n  />\n</div>\n\n<div class=\"v-multi-input__separator\"></div>\n\n<div\n  class=\"v-multi-input__input path-selector\"\n  [ngClass]=\"{'--full-width': fullWidth}\"\n  [style.flex]=\"valueColumnFlex\"\n>\n  <cds-label *ngIf=\"index === 0 && valueColumnTitle\">{{ valueColumnTitle }}</cds-label>\n\n  <valtimo-value-path-selector\n    [caseDefinitionKey]=\"caseDefinitionKey\"\n    [prefixes]=\"prefixes\"\n    [showCaseDefinitionSelector]=\"showCaseDefinitionSelector\"\n    [disabled]=\"disabled\"\n    [defaultValue]=\"value?.value\"\n    [notation]=\"notation\"\n    (valueChangeEvent)=\"onInputChange('value', $event)\"\n  ></valtimo-value-path-selector>\n</div>\n", styles: [":host{display:flex;flex-direction:row;align-items:flex-end}:host.--full-width{width:100%}:host .path-selector{flex:2}\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: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$4.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1$4.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "ngmodule", type: InputModule$1 }, { kind: "component", type: i2$2.Label, selector: "cds-label, ibm-label", inputs: ["labelInputID", "disabled", "skeleton", "helperText", "invalidText", "invalid", "warn", "warnText", "ariaLabel"] }, { kind: "directive", type: i2$2.TextInput, selector: "[cdsText], [ibmText]", inputs: ["theme", "size", "invalid", "warn", "skeleton"] }, { kind: "component", type: ValuePathSelectorComponent, selector: "valtimo-value-path-selector", inputs: ["name", "appendInline", "margin", "marginLg", "marginXl", "disabled", "caseDefinitionKey", "caseDefinitionVersionTag", "buildingBlockDefinitionKey", "buildingBlockDefinitionVersionTag", "prefixes", "label", "tooltip", "required", "showCaseDefinitionSelector", "notation", "dropUp", "defaultValue", "type", "parentItem", "filterItems"], outputs: ["valueChangeEvent", "collectionSelected"] }, { kind: "ngmodule", type: FormsModule }, { kind: "ngmodule", type: ReactiveFormsModule }] }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.20", type: KeyValuePathSelectorComponent, isStandalone: true, selector: "valtimo-key-value-path-selector", inputs: { keyColumnTitle: "keyColumnTitle", valueColumnTitle: "valueColumnTitle", index: "index", value: "value", fullWidth: "fullWidth", disabled: "disabled", caseDefinitionKey: "caseDefinitionKey", prefixes: "prefixes", showCaseDefinitionSelector: "showCaseDefinitionSelector", notation: "notation", keyColumnFlex: "keyColumnFlex", valueColumnFlex: "valueColumnFlex" }, outputs: { valueChange: "valueChange" }, host: { properties: { "class.--full-width": "this.fullWidth" } }, 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=\"v-multi-input__input key\"\n  [ngClass]=\"{'--full-width': fullWidth}\"\n  [style.flex]=\"keyColumnFlex\"\n>\n  <cds-label *ngIf=\"index === 0 && keyColumnTitle\">{{ keyColumnTitle }}</cds-label>\n\n  <input\n    cdsText\n    [defaultValue]=\"value.key\"\n    [disabled]=\"disabled\"\n    (input)=\"onInputChange('key', $event.target.value)\"\n    [attr.data-test-id]=\"testIds.keyInput\"\n  />\n</div>\n\n<div class=\"v-multi-input__separator\"></div>\n\n<div\n  class=\"v-multi-input__input path-selector\"\n  [ngClass]=\"{'--full-width': fullWidth}\"\n  [style.flex]=\"valueColumnFlex\"\n>\n  <cds-label *ngIf=\"index === 0 && valueColumnTitle\">{{ valueColumnTitle }}</cds-label>\n\n  <valtimo-value-path-selector\n    [caseDefinitionKey]=\"caseDefinitionKey\"\n    [prefixes]=\"prefixes\"\n    [showCaseDefinitionSelector]=\"showCaseDefinitionSelector\"\n    [disabled]=\"disabled\"\n    [defaultValue]=\"value?.value\"\n    [notation]=\"notation\"\n    (valueChangeEvent)=\"onInputChange('value', $event)\"\n  ></valtimo-value-path-selector>\n</div>\n", styles: [":host{display:flex;flex-direction:row;align-items:flex-end}:host.--full-width{width:100%}:host .path-selector{flex:2}\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: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$4.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1$4.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "ngmodule", type: InputModule$1 }, { kind: "component", type: i2$3.Label, selector: "cds-label, ibm-label", inputs: ["labelInputID", "disabled", "skeleton", "helperText", "invalidText", "invalid", "warn", "warnText", "ariaLabel"] }, { kind: "directive", type: i2$3.TextInput, selector: "[cdsText], [ibmText]", inputs: ["theme", "size", "invalid", "warn", "skeleton"] }, { kind: "component", type: ValuePathSelectorComponent, selector: "valtimo-value-path-selector", inputs: ["name", "appendInline", "margin", "marginLg", "marginXl", "disabled", "caseDefinitionKey", "caseDefinitionVersionTag", "buildingBlockDefinitionKey", "buildingBlockDefinitionVersionTag", "prefixes", "label", "tooltip", "required", "showCaseDefinitionSelector", "notation", "dropUp", "defaultValue", "type", "parentItem", "filterItems"], outputs: ["valueChangeEvent", "collectionSelected"] }, { kind: "ngmodule", type: FormsModule }, { kind: "ngmodule", type: ReactiveFormsModule }] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.20", ngImport: i0, type: KeyValuePathSelectorComponent, decorators: [{
             type: Component,
@@ -12722,7 +12895,7 @@ class ValuePathSelectorValueComponent {
         this.valueChange.emit({ value: this.value, inputValue, type });
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.20", ngImport: i0, type: ValuePathSelectorValueComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.20", type: ValuePathSelectorValueComponent, isStandalone: true, selector: "valtimo-value-path-selector-value", inputs: { keyColumnTitle: "keyColumnTitle", valueColumnTitle: "valueColumnTitle", index: "index", value: "value", fullWidth: "fullWidth", disabled: "disabled", caseDefinitionKey: "caseDefinitionKey", prefixes: "prefixes", showCaseDefinitionSelector: "showCaseDefinitionSelector", notation: "notation", keyColumnFlex: "keyColumnFlex", valueColumnFlex: "valueColumnFlex" }, outputs: { valueChange: "valueChange" }, host: { properties: { "class.--full-width": "this.fullWidth" } }, 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=\"v-multi-input__input path-selector\"\n  [ngClass]=\"{'--full-width': fullWidth}\"\n  [style.flex]=\"keyColumnFlex\"\n>\n  <cds-label *ngIf=\"index === 0 && keyColumnTitle\">{{ keyColumnTitle }}</cds-label>\n\n  <valtimo-value-path-selector\n    [caseDefinitionKey]=\"caseDefinitionKey\"\n    [prefixes]=\"prefixes\"\n    [showCaseDefinitionSelector]=\"showCaseDefinitionSelector\"\n    [disabled]=\"disabled\"\n    [defaultValue]=\"value?.key\"\n    [notation]=\"notation\"\n    (valueChangeEvent)=\"onInputChange('key', $event)\"\n  ></valtimo-value-path-selector>\n</div>\n\n<div class=\"v-multi-input__separator\"></div>\n\n<div\n  class=\"v-multi-input__input\"\n  [ngClass]=\"{'--full-width': fullWidth}\"\n  [style.flex]=\"valueColumnFlex\"\n>\n  <cds-label *ngIf=\"index === 0 && valueColumnTitle\">{{ valueColumnTitle }}</cds-label>\n\n  <input\n    cdsText\n    [defaultValue]=\"value.value\"\n    [disabled]=\"disabled\"\n    (input)=\"onInputChange('value', $event.target.value)\"\n    [attr.data-test-id]=\"testIds.valueInput\"\n  />\n</div>\n", styles: [":host{display:flex;flex-direction:row;align-items:flex-end}:host.--full-width{width:100%}:host .path-selector{flex:2}\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: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$4.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1$4.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "ngmodule", type: InputModule$1 }, { kind: "component", type: i2$2.Label, selector: "cds-label, ibm-label", inputs: ["labelInputID", "disabled", "skeleton", "helperText", "invalidText", "invalid", "warn", "warnText", "ariaLabel"] }, { kind: "directive", type: i2$2.TextInput, selector: "[cdsText], [ibmText]", inputs: ["theme", "size", "invalid", "warn", "skeleton"] }, { kind: "component", type: ValuePathSelectorComponent, selector: "valtimo-value-path-selector", inputs: ["name", "appendInline", "margin", "marginLg", "marginXl", "disabled", "caseDefinitionKey", "caseDefinitionVersionTag", "buildingBlockDefinitionKey", "buildingBlockDefinitionVersionTag", "prefixes", "label", "tooltip", "required", "showCaseDefinitionSelector", "notation", "dropUp", "defaultValue", "type", "parentItem", "filterItems"], outputs: ["valueChangeEvent", "collectionSelected"] }, { kind: "ngmodule", type: FormsModule }, { kind: "ngmodule", type: ReactiveFormsModule }] }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.20", type: ValuePathSelectorValueComponent, isStandalone: true, selector: "valtimo-value-path-selector-value", inputs: { keyColumnTitle: "keyColumnTitle", valueColumnTitle: "valueColumnTitle", index: "index", value: "value", fullWidth: "fullWidth", disabled: "disabled", caseDefinitionKey: "caseDefinitionKey", prefixes: "prefixes", showCaseDefinitionSelector: "showCaseDefinitionSelector", notation: "notation", keyColumnFlex: "keyColumnFlex", valueColumnFlex: "valueColumnFlex" }, outputs: { valueChange: "valueChange" }, host: { properties: { "class.--full-width": "this.fullWidth" } }, 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=\"v-multi-input__input path-selector\"\n  [ngClass]=\"{'--full-width': fullWidth}\"\n  [style.flex]=\"keyColumnFlex\"\n>\n  <cds-label *ngIf=\"index === 0 && keyColumnTitle\">{{ keyColumnTitle }}</cds-label>\n\n  <valtimo-value-path-selector\n    [caseDefinitionKey]=\"caseDefinitionKey\"\n    [prefixes]=\"prefixes\"\n    [showCaseDefinitionSelector]=\"showCaseDefinitionSelector\"\n    [disabled]=\"disabled\"\n    [defaultValue]=\"value?.key\"\n    [notation]=\"notation\"\n    (valueChangeEvent)=\"onInputChange('key', $event)\"\n  ></valtimo-value-path-selector>\n</div>\n\n<div class=\"v-multi-input__separator\"></div>\n\n<div\n  class=\"v-multi-input__input\"\n  [ngClass]=\"{'--full-width': fullWidth}\"\n  [style.flex]=\"valueColumnFlex\"\n>\n  <cds-label *ngIf=\"index === 0 && valueColumnTitle\">{{ valueColumnTitle }}</cds-label>\n\n  <input\n    cdsText\n    [defaultValue]=\"value.value\"\n    [disabled]=\"disabled\"\n    (input)=\"onInputChange('value', $event.target.value)\"\n    [attr.data-test-id]=\"testIds.valueInput\"\n  />\n</div>\n", styles: [":host{display:flex;flex-direction:row;align-items:flex-end}:host.--full-width{width:100%}:host .path-selector{flex:2}\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: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$4.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1$4.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "ngmodule", type: InputModule$1 }, { kind: "component", type: i2$3.Label, selector: "cds-label, ibm-label", inputs: ["labelInputID", "disabled", "skeleton", "helperText", "invalidText", "invalid", "warn", "warnText", "ariaLabel"] }, { kind: "directive", type: i2$3.TextInput, selector: "[cdsText], [ibmText]", inputs: ["theme", "size", "invalid", "warn", "skeleton"] }, { kind: "component", type: ValuePathSelectorComponent, selector: "valtimo-value-path-selector", inputs: ["name", "appendInline", "margin", "marginLg", "marginXl", "disabled", "caseDefinitionKey", "caseDefinitionVersionTag", "buildingBlockDefinitionKey", "buildingBlockDefinitionVersionTag", "prefixes", "label", "tooltip", "required", "showCaseDefinitionSelector", "notation", "dropUp", "defaultValue", "type", "parentItem", "filterItems"], outputs: ["valueChangeEvent", "collectionSelected"] }, { kind: "ngmodule", type: FormsModule }, { kind: "ngmodule", type: ReactiveFormsModule }] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.20", ngImport: i0, type: ValuePathSelectorValueComponent, decorators: [{
             type: Component,
@@ -12798,7 +12971,7 @@ class ValuePathSelectorDropdownValueComponent {
         this.valueChange.emit({ value: this.value, inputValue, type });
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.20", ngImport: i0, type: ValuePathSelectorDropdownValueComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.20", type: ValuePathSelectorDropdownValueComponent, isStandalone: true, selector: "valtimo-value-path-selector-dropdown-value", inputs: { keyColumnTitle: "keyColumnTitle", valueColumnTitle: "valueColumnTitle", dropdownColumnTitle: "dropdownColumnTitle", index: "index", value: "value", dropdownItems$: "dropdownItems$", caseDefinitionKey: "caseDefinitionKey", prefixes: "prefixes", showCaseDefinitionSelector: "showCaseDefinitionSelector", notation: "notation", dropdownWidth: "dropdownWidth", fullWidth: "fullWidth", disabled: "disabled", keyColumnFlex: "keyColumnFlex", dropdownColumnFlex: "dropdownColumnFlex", valueColumnFlex: "valueColumnFlex" }, outputs: { valueChange: "valueChange" }, host: { properties: { "class.--full-width": "this.fullWidth" } }, 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=\"v-multi-input__input path-selector\"\n  [ngClass]=\"{'--full-width': fullWidth}\"\n  [style.flex]=\"keyColumnFlex\"\n>\n  <cds-label *ngIf=\"index === 0 && keyColumnTitle\">{{ keyColumnTitle }}</cds-label>\n\n  <valtimo-value-path-selector\n    [caseDefinitionKey]=\"caseDefinitionKey\"\n    [prefixes]=\"prefixes\"\n    [showCaseDefinitionSelector]=\"showCaseDefinitionSelector\"\n    [disabled]=\"disabled\"\n    [defaultValue]=\"value?.key\"\n    [notation]=\"notation\"\n    (valueChangeEvent)=\"onInputChange('key', $event)\"\n  ></valtimo-value-path-selector>\n</div>\n\n<div class=\"v-multi-input__separator\"></div>\n\n<div\n  class=\"v-multi-input__input\"\n  [ngClass]=\"{'--full-width': fullWidth}\"\n  [style.minWidth.px]=\"dropdownWidth\"\n  [style.flex]=\"dropdownColumnFlex\"\n>\n  <cds-label *ngIf=\"index === 0 && dropdownColumnTitle\">{{ dropdownColumnTitle }}</cds-label>\n\n  <cds-dropdown\n    (selected)=\"onInputChange('dropdown', $event.item.id)\"\n    [appendInline]=\"true\"\n    [attr.data-test-id]=\"testIds.dropdown\"\n  >\n    <cds-dropdown-list [items]=\"dropdownItems$ | async\" type=\"multi\"></cds-dropdown-list>\n  </cds-dropdown>\n</div>\n\n<div class=\"v-multi-input__separator\"></div>\n\n<div\n  class=\"v-multi-input__input\"\n  [ngClass]=\"{'--full-width': fullWidth}\"\n  [style.flex]=\"valueColumnFlex\"\n>\n  <cds-label *ngIf=\"index === 0 && valueColumnTitle\">{{ valueColumnTitle }}</cds-label>\n\n  <input\n    cdsText\n    [defaultValue]=\"value.value\"\n    [disabled]=\"disabled\"\n    (input)=\"onInputChange('value', $event.target.value)\"\n    [attr.data-test-id]=\"testIds.valueInput\"\n  />\n</div>\n", styles: [":host{display:flex;align-items:flex-end}:host.--full-width{width:100%}:host .process-start-modal-content{padding:16px}\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: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$4.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1$4.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "pipe", type: i1$4.AsyncPipe, name: "async" }, { kind: "ngmodule", type: InputModule$1 }, { kind: "component", type: i2$2.Label, selector: "cds-label, ibm-label", inputs: ["labelInputID", "disabled", "skeleton", "helperText", "invalidText", "invalid", "warn", "warnText", "ariaLabel"] }, { kind: "directive", type: i2$2.TextInput, selector: "[cdsText], [ibmText]", inputs: ["theme", "size", "invalid", "warn", "skeleton"] }, { kind: "ngmodule", type: DropdownModule }, { kind: "component", type: i2$2.Dropdown, selector: "cds-dropdown, ibm-dropdown", inputs: ["id", "label", "hideLabel", "helperText", "placeholder", "displayValue", "clearText", "size", "type", "theme", "disabled", "readonly", "skeleton", "inline", "disableArrowKeys", "invalid", "invalidText", "warn", "warnText", "appendInline", "scrollableContainer", "itemValueKey", "selectionFeedback", "menuButtonLabel", "selectedLabel", "dropUp", "fluid"], outputs: ["selected", "onClose", "close"] }, { kind: "component", type: i2$2.DropdownList, selector: "cds-dropdown-list, ibm-dropdown-list", inputs: ["ariaLabel", "items", "listTpl", "type", "showTitles"], outputs: ["select", "scroll", "blurIntent"] }, { kind: "component", type: ValuePathSelectorComponent, selector: "valtimo-value-path-selector", inputs: ["name", "appendInline", "margin", "marginLg", "marginXl", "disabled", "caseDefinitionKey", "caseDefinitionVersionTag", "buildingBlockDefinitionKey", "buildingBlockDefinitionVersionTag", "prefixes", "label", "tooltip", "required", "showCaseDefinitionSelector", "notation", "dropUp", "defaultValue", "type", "parentItem", "filterItems"], outputs: ["valueChangeEvent", "collectionSelected"] }, { kind: "ngmodule", type: FormsModule }, { kind: "ngmodule", type: ReactiveFormsModule }] }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.20", type: ValuePathSelectorDropdownValueComponent, isStandalone: true, selector: "valtimo-value-path-selector-dropdown-value", inputs: { keyColumnTitle: "keyColumnTitle", valueColumnTitle: "valueColumnTitle", dropdownColumnTitle: "dropdownColumnTitle", index: "index", value: "value", dropdownItems$: "dropdownItems$", caseDefinitionKey: "caseDefinitionKey", prefixes: "prefixes", showCaseDefinitionSelector: "showCaseDefinitionSelector", notation: "notation", dropdownWidth: "dropdownWidth", fullWidth: "fullWidth", disabled: "disabled", keyColumnFlex: "keyColumnFlex", dropdownColumnFlex: "dropdownColumnFlex", valueColumnFlex: "valueColumnFlex" }, outputs: { valueChange: "valueChange" }, host: { properties: { "class.--full-width": "this.fullWidth" } }, 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=\"v-multi-input__input path-selector\"\n  [ngClass]=\"{'--full-width': fullWidth}\"\n  [style.flex]=\"keyColumnFlex\"\n>\n  <cds-label *ngIf=\"index === 0 && keyColumnTitle\">{{ keyColumnTitle }}</cds-label>\n\n  <valtimo-value-path-selector\n    [caseDefinitionKey]=\"caseDefinitionKey\"\n    [prefixes]=\"prefixes\"\n    [showCaseDefinitionSelector]=\"showCaseDefinitionSelector\"\n    [disabled]=\"disabled\"\n    [defaultValue]=\"value?.key\"\n    [notation]=\"notation\"\n    (valueChangeEvent)=\"onInputChange('key', $event)\"\n  ></valtimo-value-path-selector>\n</div>\n\n<div class=\"v-multi-input__separator\"></div>\n\n<div\n  class=\"v-multi-input__input\"\n  [ngClass]=\"{'--full-width': fullWidth}\"\n  [style.minWidth.px]=\"dropdownWidth\"\n  [style.flex]=\"dropdownColumnFlex\"\n>\n  <cds-label *ngIf=\"index === 0 && dropdownColumnTitle\">{{ dropdownColumnTitle }}</cds-label>\n\n  <cds-dropdown\n    (selected)=\"onInputChange('dropdown', $event.item.id)\"\n    [appendInline]=\"true\"\n    [attr.data-test-id]=\"testIds.dropdown\"\n  >\n    <cds-dropdown-list [items]=\"dropdownItems$ | async\" type=\"multi\"></cds-dropdown-list>\n  </cds-dropdown>\n</div>\n\n<div class=\"v-multi-input__separator\"></div>\n\n<div\n  class=\"v-multi-input__input\"\n  [ngClass]=\"{'--full-width': fullWidth}\"\n  [style.flex]=\"valueColumnFlex\"\n>\n  <cds-label *ngIf=\"index === 0 && valueColumnTitle\">{{ valueColumnTitle }}</cds-label>\n\n  <input\n    cdsText\n    [defaultValue]=\"value.value\"\n    [disabled]=\"disabled\"\n    (input)=\"onInputChange('value', $event.target.value)\"\n    [attr.data-test-id]=\"testIds.valueInput\"\n  />\n</div>\n", styles: [":host{display:flex;align-items:flex-end}:host.--full-width{width:100%}:host .process-start-modal-content{padding:16px}\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: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$4.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1$4.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "pipe", type: i1$4.AsyncPipe, name: "async" }, { kind: "ngmodule", type: InputModule$1 }, { kind: "component", type: i2$3.Label, selector: "cds-label, ibm-label", inputs: ["labelInputID", "disabled", "skeleton", "helperText", "invalidText", "invalid", "warn", "warnText", "ariaLabel"] }, { kind: "directive", type: i2$3.TextInput, selector: "[cdsText], [ibmText]", inputs: ["theme", "size", "invalid", "warn", "skeleton"] }, { kind: "ngmodule", type: DropdownModule }, { kind: "component", type: i2$3.Dropdown, selector: "cds-dropdown, ibm-dropdown", inputs: ["id", "label", "hideLabel", "helperText", "placeholder", "displayValue", "clearText", "size", "type", "theme", "disabled", "readonly", "skeleton", "inline", "disableArrowKeys", "invalid", "invalidText", "warn", "warnText", "appendInline", "scrollableContainer", "itemValueKey", "selectionFeedback", "menuButtonLabel", "selectedLabel", "dropUp", "fluid"], outputs: ["selected", "onClose", "close"] }, { kind: "component", type: i2$3.DropdownList, selector: "cds-dropdown-list, ibm-dropdown-list", inputs: ["ariaLabel", "items", "listTpl", "type", "showTitles"], outputs: ["select", "scroll", "blurIntent"] }, { kind: "component", type: ValuePathSelectorComponent, selector: "valtimo-value-path-selector", inputs: ["name", "appendInline", "margin", "marginLg", "marginXl", "disabled", "caseDefinitionKey", "caseDefinitionVersionTag", "buildingBlockDefinitionKey", "buildingBlockDefinitionVersionTag", "prefixes", "label", "tooltip", "required", "showCaseDefinitionSelector", "notation", "dropUp", "defaultValue", "type", "parentItem", "filterItems"], outputs: ["valueChangeEvent", "collectionSelected"] }, { kind: "ngmodule", type: FormsModule }, { kind: "ngmodule", type: ReactiveFormsModule }] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.20", ngImport: i0, type: ValuePathSelectorDropdownValueComponent, decorators: [{
             type: Component,
@@ -13086,7 +13259,7 @@ class CarbonMultiInputComponent {
                 useExisting: forwardRef(() => CarbonMultiInputComponent),
                 multi: 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  *ngIf=\"{\n    addRowText:\n      addRowText || addRowTranslationKey\n        ? addRowTranslationKey\n          ? (addRowTranslationKey | translate)\n          : addRowText\n        : ('interface.addRow' | translate),\n    deleteRowText:\n      deleteRowText || deleteRowTranslationKey\n        ? deleteRowTranslationKey\n          ? (deleteRowTranslationKey | translate)\n          : deleteRowText\n        : ('interface.deleteRow' | translate),\n  } as vars\"\n  [ngClass]=\"{'v-multi-input--margin': margin, 'v-multi-input--no-delete-button': hideDeleteButton}\"\n  class=\"v-multi-input\"\n>\n  <v-input-label\n    *ngIf=\"title || titleTranslationKey\"\n    [name]=\"name\"\n    [required]=\"required\"\n    [titleTranslationKey]=\"titleTranslationKey\"\n    [title]=\"title\"\n    [tooltip]=\"tooltip\"\n  >\n  </v-input-label>\n\n  <div class=\"v-multi-input__rows\">\n    <div\n      *ngFor=\"let value of values$ | async as values; trackBy: trackByFn; index as i\"\n      class=\"v-multi-input__row\"\n    >\n      @switch (type) {\n        @case ('value') {\n          <valtimo-single-value\n            [value]=\"value\"\n            [fullWidth]=\"fullWidth\"\n            [disabled]=\"$disabled()\"\n            (valueChange)=\"onValueChange($event.value, $event.inputValue, 'value')\"\n          ></valtimo-single-value>\n        }\n        @case ('keyValue') {\n          <valtimo-key-value\n            [keyColumnTitle]=\"keyColumnTitle\"\n            [valueColumnTitle]=\"valueColumnTitle\"\n            [index]=\"i\"\n            [value]=\"value\"\n            [fullWidth]=\"fullWidth\"\n            [disabled]=\"$disabled()\"\n            [keyColumnFlex]=\"keyColumnFlex\"\n            [valueColumnFlex]=\"valueColumnFlex\"\n            (valueChange)=\"onValueChange($event.value, $event.inputValue, $event.type)\"\n          ></valtimo-key-value>\n        }\n        @case ('keyDropdownValue') {\n          <valtimo-key-dropdown-value\n            [keyColumnTitle]=\"keyColumnTitle\"\n            [valueColumnTitle]=\"valueColumnTitle\"\n            [dropdownColumnTitle]=\"dropdownColumnTitle\"\n            [index]=\"i\"\n            [value]=\"value\"\n            [dropdownItems$]=\"getDropdownItemsForRow(i)\"\n            [dropdownWidth]=\"dropdownWidth\"\n            [fullWidth]=\"fullWidth\"\n            [disabled]=\"$disabled()\"\n            [keyColumnFlex]=\"keyColumnFlex\"\n            [dropdownColumnFlex]=\"dropdownColumnFlex\"\n            [valueColumnFlex]=\"valueColumnFlex\"\n            (valueChange)=\"onValueChange($event.value, $event.inputValue, $event.type)\"\n          ></valtimo-key-dropdown-value>\n        }\n        @case ('arbitraryAmount') {\n          <valtimo-arbitrary-amount-value\n            [index]=\"i\"\n            [value]=\"value\"\n            [fullWidth]=\"fullWidth\"\n            [disabled]=\"$disabled()\"\n            [arbitraryAmountTitles]=\"arbitraryAmountTitles\"\n            [amountOfArbitraryValuesArray$]=\"amountOfArbitraryValuesArray$\"\n            (valueChange)=\"\n              onValueChange($event.value, $event.inputValue, $event.type, $event.arbitraryIndex)\n            \"\n          ></valtimo-arbitrary-amount-value>\n        }\n        @case ('keyValuePathSelector') {\n          <valtimo-key-value-path-selector\n            [keyColumnTitle]=\"keyColumnTitle\"\n            [valueColumnTitle]=\"valueColumnTitle\"\n            [index]=\"i\"\n            [value]=\"value\"\n            [fullWidth]=\"fullWidth\"\n            [disabled]=\"$disabled()\"\n            [caseDefinitionKey]=\"valuePathSelectorCaseDefinitionKey\"\n            [prefixes]=\"valuePathSelectorPrefixes\"\n            [showCaseDefinitionSelector]=\"valuePathSelectorShowCaseDefinitionSelector\"\n            [notation]=\"valuePathSelectorNotation\"\n            [keyColumnFlex]=\"keyColumnFlex\"\n            [valueColumnFlex]=\"valueColumnFlex\"\n            (valueChange)=\"onValueChange($event.value, $event.inputValue, $event.type)\"\n          ></valtimo-key-value-path-selector>\n        }\n        @case ('valuePathSelectorValue') {\n          <valtimo-value-path-selector-value\n            [keyColumnTitle]=\"keyColumnTitle\"\n            [valueColumnTitle]=\"valueColumnTitle\"\n            [index]=\"i\"\n            [value]=\"value\"\n            [fullWidth]=\"fullWidth\"\n            [disabled]=\"$disabled()\"\n            [caseDefinitionKey]=\"valuePathSelectorCaseDefinitionKey\"\n            [prefixes]=\"valuePathSelectorPrefixes\"\n            [showCaseDefinitionSelector]=\"valuePathSelectorShowCaseDefinitionSelector\"\n            [notation]=\"valuePathSelectorNotation\"\n            [keyColumnFlex]=\"keyColumnFlex\"\n            [valueColumnFlex]=\"valueColumnFlex\"\n            (valueChange)=\"onValueChange($event.value, $event.inputValue, $event.type)\"\n            [attr.data-test-id]=\"'multiInputValuePathSelectorValue-' + i\"\n          ></valtimo-value-path-selector-value>\n        }\n        @case ('valuePathSelectorDropdownValue') {\n          <valtimo-value-path-selector-dropdown-value\n            [keyColumnTitle]=\"keyColumnTitle\"\n            [dropdownColumnTitle]=\"dropdownColumnTitle\"\n            [valueColumnTitle]=\"valueColumnTitle\"\n            [index]=\"i\"\n            [value]=\"value\"\n            [fullWidth]=\"fullWidth\"\n            [disabled]=\"$disabled()\"\n            [caseDefinitionKey]=\"valuePathSelectorCaseDefinitionKey\"\n            [prefixes]=\"valuePathSelectorPrefixes\"\n            [dropdownItems$]=\"getDropdownItemsForRow(i)\"\n            [dropdownWidth]=\"dropdownWidth\"\n            [showCaseDefinitionSelector]=\"valuePathSelectorShowCaseDefinitionSelector\"\n            [notation]=\"valuePathSelectorNotation\"\n            [keyColumnFlex]=\"keyColumnFlex\"\n            [dropdownColumnFlex]=\"dropdownColumnFlex\"\n            [valueColumnFlex]=\"valueColumnFlex\"\n            (valueChange)=\"onValueChange($event.value, $event.inputValue, $event.type)\"\n            [attr.data-test-id]=\"'multiInputValuePathSelectorDropdownValue-' + i\"\n          ></valtimo-value-path-selector-dropdown-value>\n        }\n      }\n\n      <button\n        *ngIf=\"!hideDeleteButton\"\n        cdsButton=\"danger\"\n        [disabled]=\"values?.length <= this.minimumAmountOfRows || $disabled()\"\n        [iconOnly]=\"true\"\n        size=\"md\"\n        (click)=\"deleteRow(value.uuid)\"\n        [title]=\"vars.deleteRowText\"\n        [attr.data-test-id]=\"'multiInputDeleteButton-' + i\"\n      >\n        <svg cdsIcon=\"trash-can\" size=\"16\"></svg>\n      </button>\n    </div>\n\n    <div class=\"v-multi-input__add-button\">\n      <button\n        *ngIf=\"!hideAddButton\"\n        [cdsButton]=\"addButtonType\"\n        size=\"md\"\n        [disabled]=\"(addRowEnabled$ | async) === false || $disabled()\"\n        (click)=\"addRow()\"\n        [attr.data-test-id]=\"'multiInputAddButton-' + i\"\n      >\n        {{ vars.addRowText }}\n\n        <svg class=\"cds--btn__icon\" cdsIcon=\"add\" size=\"16\"></svg>\n      </button>\n    </div>\n  </div>\n</div>\n", styles: [".v-multi-input--margin{margin-block-end:var(--v-input-margin)}.v-multi-input__row{display:flex;flex-direction:row;align-items:flex-end;margin-block-end:var(--v-multi-input-row-spacing-block)}.v-multi-input__input{margin-inline-end:var(--v-multi-input-input-spacing-inline)}.v-multi-input__input.--full-width{flex:1}.v-multi-input__separator{height:40px;width:12px;display:flex;justify-content:flex-start}.v-multi-input__separator:before{content:\"\";height:100%;width:1px;background-color:var(--cds-border-subtle-selected)}.v-multi-input--no-delete-button .v-multi-input__input:last-child{margin-inline-end:0}\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: "component", type: InputLabelComponent, selector: "v-input-label", inputs: ["name", "tooltip", "tooltipTranslationKey", "largeMargin", "small", "noMargin", "title", "titleTranslationKey", "required", "disabled", "carbonTheme"] }, { kind: "directive", type: i2$2.Button, selector: "[cdsButton], [ibmButton]", inputs: ["ibmButton", "cdsButton", "size", "skeleton", "iconOnly", "isExpressive"] }, { kind: "directive", type: i2$2.IconDirective, selector: "[cdsIcon], [ibmIcon]", inputs: ["ibmIcon", "cdsIcon", "size", "title", "ariaLabel", "ariaLabelledBy", "ariaHidden", "isFocusable"] }, { kind: "component", type: KeyValueComponent, selector: "valtimo-key-value", inputs: ["keyColumnTitle", "valueColumnTitle", "index", "value", "fullWidth", "disabled", "keyColumnFlex", "valueColumnFlex"], outputs: ["valueChange"] }, { kind: "component", type: SingleValueComponent, selector: "valtimo-single-value", inputs: ["value", "fullWidth", "disabled"], outputs: ["valueChange"] }, { kind: "component", type: KeyDropdownValueComponent, selector: "valtimo-key-dropdown-value", inputs: ["keyColumnTitle", "valueColumnTitle", "dropdownColumnTitle", "index", "value", "dropdownItems$", "dropdownWidth", "fullWidth", "disabled", "keyColumnFlex", "dropdownColumnFlex", "valueColumnFlex"], outputs: ["valueChange"] }, { kind: "component", type: ArbitraryAmountValueComponent, selector: "valtimo-arbitrary-amount-value", inputs: ["index", "value", "fullWidth", "disabled", "arbitraryAmountTitles", "amountOfArbitraryValuesArray$"], outputs: ["valueChange"] }, { kind: "component", type: KeyValuePathSelectorComponent, selector: "valtimo-key-value-path-selector", inputs: ["keyColumnTitle", "valueColumnTitle", "index", "value", "fullWidth", "disabled", "caseDefinitionKey", "prefixes", "showCaseDefinitionSelector", "notation", "keyColumnFlex", "valueColumnFlex"], outputs: ["valueChange"] }, { kind: "component", type: ValuePathSelectorValueComponent, selector: "valtimo-value-path-selector-value", inputs: ["keyColumnTitle", "valueColumnTitle", "index", "value", "fullWidth", "disabled", "caseDefinitionKey", "prefixes", "showCaseDefinitionSelector", "notation", "keyColumnFlex", "valueColumnFlex"], outputs: ["valueChange"] }, { kind: "component", type: ValuePathSelectorDropdownValueComponent, selector: "valtimo-value-path-selector-dropdown-value", inputs: ["keyColumnTitle", "valueColumnTitle", "dropdownColumnTitle", "index", "value", "dropdownItems$", "caseDefinitionKey", "prefixes", "showCaseDefinitionSelector", "notation", "dropdownWidth", "fullWidth", "disabled", "keyColumnFlex", "dropdownColumnFlex", "valueColumnFlex"], outputs: ["valueChange"] }, { kind: "pipe", type: i1$4.AsyncPipe, name: "async" }, { kind: "pipe", type: i1.TranslatePipe, name: "translate" }], encapsulation: i0.ViewEncapsulation.None }); }
+        ], 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  *ngIf=\"{\n    addRowText:\n      addRowText || addRowTranslationKey\n        ? addRowTranslationKey\n          ? (addRowTranslationKey | translate)\n          : addRowText\n        : ('interface.addRow' | translate),\n    deleteRowText:\n      deleteRowText || deleteRowTranslationKey\n        ? deleteRowTranslationKey\n          ? (deleteRowTranslationKey | translate)\n          : deleteRowText\n        : ('interface.deleteRow' | translate),\n  } as vars\"\n  [ngClass]=\"{'v-multi-input--margin': margin, 'v-multi-input--no-delete-button': hideDeleteButton}\"\n  class=\"v-multi-input\"\n>\n  <v-input-label\n    *ngIf=\"title || titleTranslationKey\"\n    [name]=\"name\"\n    [required]=\"required\"\n    [titleTranslationKey]=\"titleTranslationKey\"\n    [title]=\"title\"\n    [tooltip]=\"tooltip\"\n  >\n  </v-input-label>\n\n  <div class=\"v-multi-input__rows\">\n    <div\n      *ngFor=\"let value of values$ | async as values; trackBy: trackByFn; index as i\"\n      class=\"v-multi-input__row\"\n    >\n      @switch (type) {\n        @case ('value') {\n          <valtimo-single-value\n            [value]=\"value\"\n            [fullWidth]=\"fullWidth\"\n            [disabled]=\"$disabled()\"\n            (valueChange)=\"onValueChange($event.value, $event.inputValue, 'value')\"\n          ></valtimo-single-value>\n        }\n        @case ('keyValue') {\n          <valtimo-key-value\n            [keyColumnTitle]=\"keyColumnTitle\"\n            [valueColumnTitle]=\"valueColumnTitle\"\n            [index]=\"i\"\n            [value]=\"value\"\n            [fullWidth]=\"fullWidth\"\n            [disabled]=\"$disabled()\"\n            [keyColumnFlex]=\"keyColumnFlex\"\n            [valueColumnFlex]=\"valueColumnFlex\"\n            (valueChange)=\"onValueChange($event.value, $event.inputValue, $event.type)\"\n          ></valtimo-key-value>\n        }\n        @case ('keyDropdownValue') {\n          <valtimo-key-dropdown-value\n            [keyColumnTitle]=\"keyColumnTitle\"\n            [valueColumnTitle]=\"valueColumnTitle\"\n            [dropdownColumnTitle]=\"dropdownColumnTitle\"\n            [index]=\"i\"\n            [value]=\"value\"\n            [dropdownItems$]=\"getDropdownItemsForRow(i)\"\n            [dropdownWidth]=\"dropdownWidth\"\n            [fullWidth]=\"fullWidth\"\n            [disabled]=\"$disabled()\"\n            [keyColumnFlex]=\"keyColumnFlex\"\n            [dropdownColumnFlex]=\"dropdownColumnFlex\"\n            [valueColumnFlex]=\"valueColumnFlex\"\n            (valueChange)=\"onValueChange($event.value, $event.inputValue, $event.type)\"\n          ></valtimo-key-dropdown-value>\n        }\n        @case ('arbitraryAmount') {\n          <valtimo-arbitrary-amount-value\n            [index]=\"i\"\n            [value]=\"value\"\n            [fullWidth]=\"fullWidth\"\n            [disabled]=\"$disabled()\"\n            [arbitraryAmountTitles]=\"arbitraryAmountTitles\"\n            [amountOfArbitraryValuesArray$]=\"amountOfArbitraryValuesArray$\"\n            (valueChange)=\"\n              onValueChange($event.value, $event.inputValue, $event.type, $event.arbitraryIndex)\n            \"\n          ></valtimo-arbitrary-amount-value>\n        }\n        @case ('keyValuePathSelector') {\n          <valtimo-key-value-path-selector\n            [keyColumnTitle]=\"keyColumnTitle\"\n            [valueColumnTitle]=\"valueColumnTitle\"\n            [index]=\"i\"\n            [value]=\"value\"\n            [fullWidth]=\"fullWidth\"\n            [disabled]=\"$disabled()\"\n            [caseDefinitionKey]=\"valuePathSelectorCaseDefinitionKey\"\n            [prefixes]=\"valuePathSelectorPrefixes\"\n            [showCaseDefinitionSelector]=\"valuePathSelectorShowCaseDefinitionSelector\"\n            [notation]=\"valuePathSelectorNotation\"\n            [keyColumnFlex]=\"keyColumnFlex\"\n            [valueColumnFlex]=\"valueColumnFlex\"\n            (valueChange)=\"onValueChange($event.value, $event.inputValue, $event.type)\"\n          ></valtimo-key-value-path-selector>\n        }\n        @case ('valuePathSelectorValue') {\n          <valtimo-value-path-selector-value\n            [keyColumnTitle]=\"keyColumnTitle\"\n            [valueColumnTitle]=\"valueColumnTitle\"\n            [index]=\"i\"\n            [value]=\"value\"\n            [fullWidth]=\"fullWidth\"\n            [disabled]=\"$disabled()\"\n            [caseDefinitionKey]=\"valuePathSelectorCaseDefinitionKey\"\n            [prefixes]=\"valuePathSelectorPrefixes\"\n            [showCaseDefinitionSelector]=\"valuePathSelectorShowCaseDefinitionSelector\"\n            [notation]=\"valuePathSelectorNotation\"\n            [keyColumnFlex]=\"keyColumnFlex\"\n            [valueColumnFlex]=\"valueColumnFlex\"\n            (valueChange)=\"onValueChange($event.value, $event.inputValue, $event.type)\"\n            [attr.data-test-id]=\"'multiInputValuePathSelectorValue-' + i\"\n          ></valtimo-value-path-selector-value>\n        }\n        @case ('valuePathSelectorDropdownValue') {\n          <valtimo-value-path-selector-dropdown-value\n            [keyColumnTitle]=\"keyColumnTitle\"\n            [dropdownColumnTitle]=\"dropdownColumnTitle\"\n            [valueColumnTitle]=\"valueColumnTitle\"\n            [index]=\"i\"\n            [value]=\"value\"\n            [fullWidth]=\"fullWidth\"\n            [disabled]=\"$disabled()\"\n            [caseDefinitionKey]=\"valuePathSelectorCaseDefinitionKey\"\n            [prefixes]=\"valuePathSelectorPrefixes\"\n            [dropdownItems$]=\"getDropdownItemsForRow(i)\"\n            [dropdownWidth]=\"dropdownWidth\"\n            [showCaseDefinitionSelector]=\"valuePathSelectorShowCaseDefinitionSelector\"\n            [notation]=\"valuePathSelectorNotation\"\n            [keyColumnFlex]=\"keyColumnFlex\"\n            [dropdownColumnFlex]=\"dropdownColumnFlex\"\n            [valueColumnFlex]=\"valueColumnFlex\"\n            (valueChange)=\"onValueChange($event.value, $event.inputValue, $event.type)\"\n            [attr.data-test-id]=\"'multiInputValuePathSelectorDropdownValue-' + i\"\n          ></valtimo-value-path-selector-dropdown-value>\n        }\n      }\n\n      <button\n        *ngIf=\"!hideDeleteButton\"\n        cdsButton=\"danger\"\n        [disabled]=\"values?.length <= this.minimumAmountOfRows || $disabled()\"\n        [iconOnly]=\"true\"\n        size=\"md\"\n        (click)=\"deleteRow(value.uuid)\"\n        [title]=\"vars.deleteRowText\"\n        [attr.data-test-id]=\"'multiInputDeleteButton-' + i\"\n      >\n        <svg cdsIcon=\"trash-can\" size=\"16\"></svg>\n      </button>\n    </div>\n\n    <div class=\"v-multi-input__add-button\">\n      <button\n        *ngIf=\"!hideAddButton\"\n        [cdsButton]=\"addButtonType\"\n        size=\"md\"\n        [disabled]=\"(addRowEnabled$ | async) === false || $disabled()\"\n        (click)=\"addRow()\"\n        [attr.data-test-id]=\"'multiInputAddButton-' + i\"\n      >\n        {{ vars.addRowText }}\n\n        <svg class=\"cds--btn__icon\" cdsIcon=\"add\" size=\"16\"></svg>\n      </button>\n    </div>\n  </div>\n</div>\n", styles: [".v-multi-input--margin{margin-block-end:var(--v-input-margin)}.v-multi-input__row{display:flex;flex-direction:row;align-items:flex-end;margin-block-end:var(--v-multi-input-row-spacing-block)}.v-multi-input__input{margin-inline-end:var(--v-multi-input-input-spacing-inline)}.v-multi-input__input.--full-width{flex:1}.v-multi-input__separator{height:40px;width:12px;display:flex;justify-content:flex-start}.v-multi-input__separator:before{content:\"\";height:100%;width:1px;background-color:var(--cds-border-subtle-selected)}.v-multi-input--no-delete-button .v-multi-input__input:last-child{margin-inline-end:0}\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: "component", type: InputLabelComponent, selector: "v-input-label", inputs: ["name", "tooltip", "tooltipTranslationKey", "largeMargin", "small", "noMargin", "title", "titleTranslationKey", "required", "disabled", "carbonTheme"] }, { kind: "directive", type: i2$3.Button, selector: "[cdsButton], [ibmButton]", inputs: ["ibmButton", "cdsButton", "size", "skeleton", "iconOnly", "isExpressive"] }, { kind: "directive", type: i2$3.IconDirective, selector: "[cdsIcon], [ibmIcon]", inputs: ["ibmIcon", "cdsIcon", "size", "title", "ariaLabel", "ariaLabelledBy", "ariaHidden", "isFocusable"] }, { kind: "component", type: KeyValueComponent, selector: "valtimo-key-value", inputs: ["keyColumnTitle", "valueColumnTitle", "index", "value", "fullWidth", "disabled", "keyColumnFlex", "valueColumnFlex"], outputs: ["valueChange"] }, { kind: "component", type: SingleValueComponent, selector: "valtimo-single-value", inputs: ["value", "fullWidth", "disabled"], outputs: ["valueChange"] }, { kind: "component", type: KeyDropdownValueComponent, selector: "valtimo-key-dropdown-value", inputs: ["keyColumnTitle", "valueColumnTitle", "dropdownColumnTitle", "index", "value", "dropdownItems$", "dropdownWidth", "fullWidth", "disabled", "keyColumnFlex", "dropdownColumnFlex", "valueColumnFlex"], outputs: ["valueChange"] }, { kind: "component", type: ArbitraryAmountValueComponent, selector: "valtimo-arbitrary-amount-value", inputs: ["index", "value", "fullWidth", "disabled", "arbitraryAmountTitles", "amountOfArbitraryValuesArray$"], outputs: ["valueChange"] }, { kind: "component", type: KeyValuePathSelectorComponent, selector: "valtimo-key-value-path-selector", inputs: ["keyColumnTitle", "valueColumnTitle", "index", "value", "fullWidth", "disabled", "caseDefinitionKey", "prefixes", "showCaseDefinitionSelector", "notation", "keyColumnFlex", "valueColumnFlex"], outputs: ["valueChange"] }, { kind: "component", type: ValuePathSelectorValueComponent, selector: "valtimo-value-path-selector-value", inputs: ["keyColumnTitle", "valueColumnTitle", "index", "value", "fullWidth", "disabled", "caseDefinitionKey", "prefixes", "showCaseDefinitionSelector", "notation", "keyColumnFlex", "valueColumnFlex"], outputs: ["valueChange"] }, { kind: "component", type: ValuePathSelectorDropdownValueComponent, selector: "valtimo-value-path-selector-dropdown-value", inputs: ["keyColumnTitle", "valueColumnTitle", "dropdownColumnTitle", "index", "value", "dropdownItems$", "caseDefinitionKey", "prefixes", "showCaseDefinitionSelector", "notation", "dropdownWidth", "fullWidth", "disabled", "keyColumnFlex", "dropdownColumnFlex", "valueColumnFlex"], outputs: ["valueChange"] }, { kind: "pipe", type: i1$4.AsyncPipe, name: "async" }, { kind: "pipe", type: i1.TranslatePipe, name: "translate" }], encapsulation: i0.ViewEncapsulation.None }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.20", ngImport: i0, type: CarbonMultiInputComponent, decorators: [{
             type: Component,
@@ -13284,7 +13457,7 @@ class DatePickerComponent {
         }
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.20", ngImport: i0, type: DatePickerComponent, deps: [{ token: i1.TranslateService }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.20", type: DatePickerComponent, isStandalone: false, selector: "v-date-picker", inputs: { name: "name", title: "title", placeholder: "placeholder", titleTranslationKey: "titleTranslationKey", widthPx: "widthPx", fullWidth: "fullWidth", margin: "margin", disabled: "disabled", tooltip: "tooltip", required: "required", defaultDate: "defaultDate", defaultDateIsToday: "defaultDateIsToday", smallLabel: "smallLabel", clear$: "clear$", enableTime: "enableTime", carbonTheme: "carbonTheme" }, outputs: { valueChange: "valueChange" }, host: { properties: { "class.full-width": "this.fullWidthClass" } }, viewQueries: [{ propertyName: "datePickerElement", first: true, predicate: ["datePickerElement"], 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<div class=\"v-date-picker-container\">\n  <ng-container *ngTemplateOutlet=\"inputTitle\"></ng-container>\n  <ng-container *ngTemplateOutlet=\"dateInput\"></ng-container>\n</div>\n\n<ng-template #inputTitle>\n  <v-input-label\n    *ngIf=\"title || titleTranslationKey\"\n    [name]=\"name\"\n    [required]=\"required\"\n    [small]=\"smallLabel\"\n    [titleTranslationKey]=\"titleTranslationKey\"\n    [title]=\"title\"\n    [tooltip]=\"tooltip\"\n  >\n  </v-input-label>\n</ng-template>\n\n<ng-template #dateInput>\n  <input\n    #datePickerElement\n    cdsText\n    [ngClass]=\"{\n      'v-date-picker--full-width': fullWidthClass,\n      'v-date-picker--margin': margin,\n    }\"\n    [ngModel]=\"dateValue$ | async\"\n    [placeholder]=\"placeholder\"\n    [disabled]=\"disabled\"\n    [style.width.px]=\"widthPx + 20\"\n    type=\"text\"\n  />\n</ng-template>\n", styles: [".full-width{width:100%}.v-date-picker-container{display:flex;flex-direction:column}.v-date-picker{all:unset;font-size:var(--v-input-font-size);line-height:var(--v-input-line-height);color:var(--v-input-color);font-weight:var(--v-input-font-weight);padding-block-start:var(--v-input-padding-block);padding-block-end:var(--v-input-padding-block);padding-inline-start:var(--v-input-padding-inline);padding-inline-end:var(--v-input-padding-inline);background-color:var(--v-input-bg-color);border-radius:var(--v-input-border-radius);border:var(--v-input-border);transition:var(--v-input-transition);width:var(--v-input-default-width);box-sizing:border-box}.v-date-picker:focus{outline:var(--v-input-focus-border);outline-offset:var(--v-outline-offset)}.v-date-picker:disabled{color:var(--v-input-font-color-disabled);cursor:var(--v-input-disabled-cursor)}.v-date-picker--full-width{width:100%}.v-date-picker--margin{margin-block-end:var(--v-input-margin)}\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.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1$4.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: InputLabelComponent, selector: "v-input-label", inputs: ["name", "tooltip", "tooltipTranslationKey", "largeMargin", "small", "noMargin", "title", "titleTranslationKey", "required", "disabled", "carbonTheme"] }, { kind: "directive", type: i2.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: i2$2.TextInput, selector: "[cdsText], [ibmText]", inputs: ["theme", "size", "invalid", "warn", "skeleton"] }, { kind: "pipe", type: i1$4.AsyncPipe, name: "async" }] }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.20", type: DatePickerComponent, isStandalone: false, selector: "v-date-picker", inputs: { name: "name", title: "title", placeholder: "placeholder", titleTranslationKey: "titleTranslationKey", widthPx: "widthPx", fullWidth: "fullWidth", margin: "margin", disabled: "disabled", tooltip: "tooltip", required: "required", defaultDate: "defaultDate", defaultDateIsToday: "defaultDateIsToday", smallLabel: "smallLabel", clear$: "clear$", enableTime: "enableTime", carbonTheme: "carbonTheme" }, outputs: { valueChange: "valueChange" }, host: { properties: { "class.full-width": "this.fullWidthClass" } }, viewQueries: [{ propertyName: "datePickerElement", first: true, predicate: ["datePickerElement"], 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<div class=\"v-date-picker-container\">\n  <ng-container *ngTemplateOutlet=\"inputTitle\"></ng-container>\n  <ng-container *ngTemplateOutlet=\"dateInput\"></ng-container>\n</div>\n\n<ng-template #inputTitle>\n  <v-input-label\n    *ngIf=\"title || titleTranslationKey\"\n    [name]=\"name\"\n    [required]=\"required\"\n    [small]=\"smallLabel\"\n    [titleTranslationKey]=\"titleTranslationKey\"\n    [title]=\"title\"\n    [tooltip]=\"tooltip\"\n  >\n  </v-input-label>\n</ng-template>\n\n<ng-template #dateInput>\n  <input\n    #datePickerElement\n    cdsText\n    [ngClass]=\"{\n      'v-date-picker--full-width': fullWidthClass,\n      'v-date-picker--margin': margin,\n    }\"\n    [ngModel]=\"dateValue$ | async\"\n    [placeholder]=\"placeholder\"\n    [disabled]=\"disabled\"\n    [style.width.px]=\"widthPx + 20\"\n    type=\"text\"\n  />\n</ng-template>\n", styles: [".full-width{width:100%}.v-date-picker-container{display:flex;flex-direction:column}.v-date-picker{all:unset;font-size:var(--v-input-font-size);line-height:var(--v-input-line-height);color:var(--v-input-color);font-weight:var(--v-input-font-weight);padding-block-start:var(--v-input-padding-block);padding-block-end:var(--v-input-padding-block);padding-inline-start:var(--v-input-padding-inline);padding-inline-end:var(--v-input-padding-inline);background-color:var(--v-input-bg-color);border-radius:var(--v-input-border-radius);border:var(--v-input-border);transition:var(--v-input-transition);width:var(--v-input-default-width);box-sizing:border-box}.v-date-picker:focus{outline:var(--v-input-focus-border);outline-offset:var(--v-outline-offset)}.v-date-picker:disabled{color:var(--v-input-font-color-disabled);cursor:var(--v-input-disabled-cursor)}.v-date-picker--full-width{width:100%}.v-date-picker--margin{margin-block-end:var(--v-input-margin)}\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.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1$4.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: InputLabelComponent, selector: "v-input-label", inputs: ["name", "tooltip", "tooltipTranslationKey", "largeMargin", "small", "noMargin", "title", "titleTranslationKey", "required", "disabled", "carbonTheme"] }, { kind: "directive", type: i2.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: i2$3.TextInput, selector: "[cdsText], [ibmText]", inputs: ["theme", "size", "invalid", "warn", "skeleton"] }, { kind: "pipe", type: i1$4.AsyncPipe, name: "async" }] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.20", ngImport: i0, type: DatePickerComponent, decorators: [{
             type: Component,
@@ -13507,13 +13680,13 @@ class MultiInputFormComponent {
             this.valueChange.emit(values);
         });
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.20", ngImport: i0, type: MultiInputFormComponent, deps: [{ token: i2$2.IconService }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.20", type: MultiInputFormComponent, isStandalone: false, selector: "v-multi-input-form", inputs: { name: "name", title: "title", titleTranslationKey: "titleTranslationKey", type: "type", initialAmountOfRows: "initialAmountOfRows", minimumAmountOfRows: "minimumAmountOfRows", maxRows: "maxRows", addRowText: "addRowText", addRowTranslationKey: "addRowTranslationKey", deleteRowText: "deleteRowText", deleteRowTranslationKey: "deleteRowTranslationKey", disabled: "disabled", defaultValues: "defaultValues", margin: "margin", tooltip: "tooltip", required: "required", formTemplate: "formTemplate" }, outputs: { valueChange: "valueChange", deleteRowEvent: "deleteRowEvent" }, 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=\"v-multi-input\"\n  [ngClass]=\"{'v-multi-input--margin': margin}\"\n  *ngIf=\"{\n    addRowText:\n      addRowText || addRowTranslationKey\n        ? addRowTranslationKey\n          ? (addRowTranslationKey | translate)\n          : addRowText\n        : ('interface.addRow' | translate),\n    deleteRowText:\n      deleteRowText || deleteRowTranslationKey\n        ? deleteRowTranslationKey\n          ? (deleteRowTranslationKey | translate)\n          : deleteRowText\n        : ('interface.deleteRow' | translate),\n  } as vars\"\n>\n  <v-input-label\n    *ngIf=\"title || titleTranslationKey\"\n    [title]=\"title\"\n    [titleTranslationKey]=\"titleTranslationKey\"\n    [name]=\"name\"\n    [tooltip]=\"tooltip\"\n    [required]=\"required\"\n  >\n  </v-input-label>\n  <div class=\"v-multi-input__rows\" #rows>\n    <div\n      class=\"v-multi-input__row\"\n      *ngFor=\"let value of values$ | async as values; trackBy: trackByFn; let i = index\"\n    >\n      <div\n        class=\"full-width\"\n        [ngClass]=\"{'v-multi-input__row-form--invisible': value.expanded === false}\"\n      >\n        <ng-container\n          *ngTemplateOutlet=\"\n            formTemplate;\n            context: {\n              index: i,\n              changeFunction: formValueChange,\n              uuid: value.uuid,\n              prefill: initialDefaultValues$ | defaultValue: value.uuid | async,\n            }\n          \"\n        ></ng-container>\n      </div>\n      <div *ngIf=\"value.expanded === false\">\n        <v-paragraph>{{ getFirstValue(value) }}</v-paragraph>\n      </div>\n      <div class=\"v-multi-input__buttons\">\n        <div class=\"v-multi-input__toggle-button\">\n          <cds-icon-button\n            (click)=\"toggleRow(value.uuid, value.expanded)\"\n            size=\"sm\"\n            [title]=\"\n              value.expanded ? ('interface.collapse' | translate) : ('interface.expand' | translate)\n            \"\n          >\n            <svg\n              [cdsIcon]=\"value.expanded === true ? 'chevron--up' : 'chevron--down'\"\n              size=\"16\"\n            ></svg>\n          </cds-icon-button>\n        </div>\n\n        <div class=\"v-multi-input__delete-button\">\n          <cds-icon-button\n            [disabled]=\"values?.length <= this.minimumAmountOfRows || disabled\"\n            (click)=\"deleteRow(value.uuid)\"\n            size=\"sm\"\n            kind=\"danger\"\n            [title]=\"vars.deleteRowText\"\n          >\n            <svg cdsIcon=\"close\" size=\"16\"></svg>\n          </cds-icon-button>\n        </div>\n      </div>\n    </div>\n    <div class=\"v-multi-input__add-button\">\n      <button\n        cdsButton\n        (click)=\"addRow()\"\n        [title]=\"vars.addRowText\"\n        [disabled]=\"(addRowEnabled$ | async) === false || disabled\"\n      >\n        <svg cdsIcon=\"add\" size=\"16\"></svg>\n\n        {{ vars.addRowText }}\n      </button>\n    </div>\n  </div>\n</div>\n", styles: [".v-multi-input--margin{margin-block-end:var(--v-input-margin)}.v-multi-input__row{display:flex;flex-direction:row;align-items:center;justify-content:space-between;margin-block-end:var(--v-multi-input-row-spacing-block);border:var(--v-multi-input-form-border);padding-block-start:var(--v-multi-input-padding);padding-block-end:var(--v-multi-input-padding);padding-inline-start:var(--v-multi-input-padding);padding-inline-end:var(--v-multi-input-padding);background-color:var(--v-multi-input-form-bg-color)}.v-multi-input__delete-button{align-self:flex-start}.v-multi-input__input{margin-inline-end:var(--v-multi-input-input-spacing-inline)}.v-multi-input__row-form--invisible{display:none}.v-multi-input__buttons{display:flex;align-items:center;justify-content:center;align-self:flex-start}.v-multi-input__toggle-button{margin-inline-end:var(--v-multi-input-button-spacing)}\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: InputLabelComponent, selector: "v-input-label", inputs: ["name", "tooltip", "tooltipTranslationKey", "largeMargin", "small", "noMargin", "title", "titleTranslationKey", "required", "disabled", "carbonTheme"] }, { kind: "directive", type: i2$2.Button, selector: "[cdsButton], [ibmButton]", inputs: ["ibmButton", "cdsButton", "size", "skeleton", "iconOnly", "isExpressive"] }, { kind: "component", type: i2$2.IconButton, selector: "cds-icon-button, ibm-icon-button", inputs: ["buttonNgClass", "buttonAttributes", "buttonId", "kind", "size", "type", "isExpressive", "disabled", "description", "showTooltipWhenDisabled"], outputs: ["click", "focus", "blur", "tooltipClick"] }, { kind: "component", type: ParagraphComponent, selector: "v-paragraph", inputs: ["center", "fullWidth", "margin", "italic", "loading", "dataTestId"] }, { kind: "directive", type: i2$2.IconDirective, selector: "[cdsIcon], [ibmIcon]", inputs: ["ibmIcon", "cdsIcon", "size", "title", "ariaLabel", "ariaLabelledBy", "ariaHidden", "isFocusable"] }, { kind: "pipe", type: i1$4.AsyncPipe, name: "async" }, { kind: "pipe", type: i1.TranslatePipe, name: "translate" }, { kind: "pipe", type: DefaultValuePipe, name: "defaultValue" }] }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.20", ngImport: i0, type: MultiInputFormComponent, deps: [{ token: i2$3.IconService }], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.20", type: MultiInputFormComponent, isStandalone: false, selector: "v-multi-input-form", inputs: { name: "name", title: "title", titleTranslationKey: "titleTranslationKey", type: "type", initialAmountOfRows: "initialAmountOfRows", minimumAmountOfRows: "minimumAmountOfRows", maxRows: "maxRows", addRowText: "addRowText", addRowTranslationKey: "addRowTranslationKey", deleteRowText: "deleteRowText", deleteRowTranslationKey: "deleteRowTranslationKey", disabled: "disabled", defaultValues: "defaultValues", margin: "margin", tooltip: "tooltip", required: "required", formTemplate: "formTemplate" }, outputs: { valueChange: "valueChange", deleteRowEvent: "deleteRowEvent" }, 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=\"v-multi-input\"\n  [ngClass]=\"{'v-multi-input--margin': margin}\"\n  *ngIf=\"{\n    addRowText:\n      addRowText || addRowTranslationKey\n        ? addRowTranslationKey\n          ? (addRowTranslationKey | translate)\n          : addRowText\n        : ('interface.addRow' | translate),\n    deleteRowText:\n      deleteRowText || deleteRowTranslationKey\n        ? deleteRowTranslationKey\n          ? (deleteRowTranslationKey | translate)\n          : deleteRowText\n        : ('interface.deleteRow' | translate),\n  } as vars\"\n>\n  <v-input-label\n    *ngIf=\"title || titleTranslationKey\"\n    [title]=\"title\"\n    [titleTranslationKey]=\"titleTranslationKey\"\n    [name]=\"name\"\n    [tooltip]=\"tooltip\"\n    [required]=\"required\"\n  >\n  </v-input-label>\n  <div class=\"v-multi-input__rows\" #rows>\n    <div\n      class=\"v-multi-input__row\"\n      *ngFor=\"let value of values$ | async as values; trackBy: trackByFn; let i = index\"\n    >\n      <div\n        class=\"full-width\"\n        [ngClass]=\"{'v-multi-input__row-form--invisible': value.expanded === false}\"\n      >\n        <ng-container\n          *ngTemplateOutlet=\"\n            formTemplate;\n            context: {\n              index: i,\n              changeFunction: formValueChange,\n              uuid: value.uuid,\n              prefill: initialDefaultValues$ | defaultValue: value.uuid | async,\n            }\n          \"\n        ></ng-container>\n      </div>\n      <div *ngIf=\"value.expanded === false\">\n        <v-paragraph>{{ getFirstValue(value) }}</v-paragraph>\n      </div>\n      <div class=\"v-multi-input__buttons\">\n        <div class=\"v-multi-input__toggle-button\">\n          <cds-icon-button\n            (click)=\"toggleRow(value.uuid, value.expanded)\"\n            size=\"sm\"\n            [title]=\"\n              value.expanded ? ('interface.collapse' | translate) : ('interface.expand' | translate)\n            \"\n          >\n            <svg\n              [cdsIcon]=\"value.expanded === true ? 'chevron--up' : 'chevron--down'\"\n              size=\"16\"\n            ></svg>\n          </cds-icon-button>\n        </div>\n\n        <div class=\"v-multi-input__delete-button\">\n          <cds-icon-button\n            [disabled]=\"values?.length <= this.minimumAmountOfRows || disabled\"\n            (click)=\"deleteRow(value.uuid)\"\n            size=\"sm\"\n            kind=\"danger\"\n            [title]=\"vars.deleteRowText\"\n          >\n            <svg cdsIcon=\"close\" size=\"16\"></svg>\n          </cds-icon-button>\n        </div>\n      </div>\n    </div>\n    <div class=\"v-multi-input__add-button\">\n      <button\n        cdsButton\n        (click)=\"addRow()\"\n        [title]=\"vars.addRowText\"\n        [disabled]=\"(addRowEnabled$ | async) === false || disabled\"\n      >\n        <svg cdsIcon=\"add\" size=\"16\"></svg>\n\n        {{ vars.addRowText }}\n      </button>\n    </div>\n  </div>\n</div>\n", styles: [".v-multi-input--margin{margin-block-end:var(--v-input-margin)}.v-multi-input__row{display:flex;flex-direction:row;align-items:center;justify-content:space-between;margin-block-end:var(--v-multi-input-row-spacing-block);border:var(--v-multi-input-form-border);padding-block-start:var(--v-multi-input-padding);padding-block-end:var(--v-multi-input-padding);padding-inline-start:var(--v-multi-input-padding);padding-inline-end:var(--v-multi-input-padding);background-color:var(--v-multi-input-form-bg-color)}.v-multi-input__delete-button{align-self:flex-start}.v-multi-input__input{margin-inline-end:var(--v-multi-input-input-spacing-inline)}.v-multi-input__row-form--invisible{display:none}.v-multi-input__buttons{display:flex;align-items:center;justify-content:center;align-self:flex-start}.v-multi-input__toggle-button{margin-inline-end:var(--v-multi-input-button-spacing)}\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: InputLabelComponent, selector: "v-input-label", inputs: ["name", "tooltip", "tooltipTranslationKey", "largeMargin", "small", "noMargin", "title", "titleTranslationKey", "required", "disabled", "carbonTheme"] }, { kind: "directive", type: i2$3.Button, selector: "[cdsButton], [ibmButton]", inputs: ["ibmButton", "cdsButton", "size", "skeleton", "iconOnly", "isExpressive"] }, { kind: "component", type: i2$3.IconButton, selector: "cds-icon-button, ibm-icon-button", inputs: ["buttonNgClass", "buttonAttributes", "buttonId", "kind", "size", "type", "isExpressive", "disabled", "description", "showTooltipWhenDisabled"], outputs: ["click", "focus", "blur", "tooltipClick"] }, { kind: "component", type: ParagraphComponent, selector: "v-paragraph", inputs: ["center", "fullWidth", "margin", "italic", "loading", "dataTestId"] }, { kind: "directive", type: i2$3.IconDirective, selector: "[cdsIcon], [ibmIcon]", inputs: ["ibmIcon", "cdsIcon", "size", "title", "ariaLabel", "ariaLabelledBy", "ariaHidden", "isFocusable"] }, { kind: "pipe", type: i1$4.AsyncPipe, name: "async" }, { kind: "pipe", type: i1.TranslatePipe, name: "translate" }, { kind: "pipe", type: DefaultValuePipe, name: "defaultValue" }] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.20", ngImport: i0, type: MultiInputFormComponent, decorators: [{
             type: Component,
             args: [{ selector: 'v-multi-input-form', 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=\"v-multi-input\"\n  [ngClass]=\"{'v-multi-input--margin': margin}\"\n  *ngIf=\"{\n    addRowText:\n      addRowText || addRowTranslationKey\n        ? addRowTranslationKey\n          ? (addRowTranslationKey | translate)\n          : addRowText\n        : ('interface.addRow' | translate),\n    deleteRowText:\n      deleteRowText || deleteRowTranslationKey\n        ? deleteRowTranslationKey\n          ? (deleteRowTranslationKey | translate)\n          : deleteRowText\n        : ('interface.deleteRow' | translate),\n  } as vars\"\n>\n  <v-input-label\n    *ngIf=\"title || titleTranslationKey\"\n    [title]=\"title\"\n    [titleTranslationKey]=\"titleTranslationKey\"\n    [name]=\"name\"\n    [tooltip]=\"tooltip\"\n    [required]=\"required\"\n  >\n  </v-input-label>\n  <div class=\"v-multi-input__rows\" #rows>\n    <div\n      class=\"v-multi-input__row\"\n      *ngFor=\"let value of values$ | async as values; trackBy: trackByFn; let i = index\"\n    >\n      <div\n        class=\"full-width\"\n        [ngClass]=\"{'v-multi-input__row-form--invisible': value.expanded === false}\"\n      >\n        <ng-container\n          *ngTemplateOutlet=\"\n            formTemplate;\n            context: {\n              index: i,\n              changeFunction: formValueChange,\n              uuid: value.uuid,\n              prefill: initialDefaultValues$ | defaultValue: value.uuid | async,\n            }\n          \"\n        ></ng-container>\n      </div>\n      <div *ngIf=\"value.expanded === false\">\n        <v-paragraph>{{ getFirstValue(value) }}</v-paragraph>\n      </div>\n      <div class=\"v-multi-input__buttons\">\n        <div class=\"v-multi-input__toggle-button\">\n          <cds-icon-button\n            (click)=\"toggleRow(value.uuid, value.expanded)\"\n            size=\"sm\"\n            [title]=\"\n              value.expanded ? ('interface.collapse' | translate) : ('interface.expand' | translate)\n            \"\n          >\n            <svg\n              [cdsIcon]=\"value.expanded === true ? 'chevron--up' : 'chevron--down'\"\n              size=\"16\"\n            ></svg>\n          </cds-icon-button>\n        </div>\n\n        <div class=\"v-multi-input__delete-button\">\n          <cds-icon-button\n            [disabled]=\"values?.length <= this.minimumAmountOfRows || disabled\"\n            (click)=\"deleteRow(value.uuid)\"\n            size=\"sm\"\n            kind=\"danger\"\n            [title]=\"vars.deleteRowText\"\n          >\n            <svg cdsIcon=\"close\" size=\"16\"></svg>\n          </cds-icon-button>\n        </div>\n      </div>\n    </div>\n    <div class=\"v-multi-input__add-button\">\n      <button\n        cdsButton\n        (click)=\"addRow()\"\n        [title]=\"vars.addRowText\"\n        [disabled]=\"(addRowEnabled$ | async) === false || disabled\"\n      >\n        <svg cdsIcon=\"add\" size=\"16\"></svg>\n\n        {{ vars.addRowText }}\n      </button>\n    </div>\n  </div>\n</div>\n", styles: [".v-multi-input--margin{margin-block-end:var(--v-input-margin)}.v-multi-input__row{display:flex;flex-direction:row;align-items:center;justify-content:space-between;margin-block-end:var(--v-multi-input-row-spacing-block);border:var(--v-multi-input-form-border);padding-block-start:var(--v-multi-input-padding);padding-block-end:var(--v-multi-input-padding);padding-inline-start:var(--v-multi-input-padding);padding-inline-end:var(--v-multi-input-padding);background-color:var(--v-multi-input-form-bg-color)}.v-multi-input__delete-button{align-self:flex-start}.v-multi-input__input{margin-inline-end:var(--v-multi-input-input-spacing-inline)}.v-multi-input__row-form--invisible{display:none}.v-multi-input__buttons{display:flex;align-items:center;justify-content:center;align-self:flex-start}.v-multi-input__toggle-button{margin-inline-end:var(--v-multi-input-button-spacing)}\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: i2$2.IconService }], propDecorators: { name: [{
+        }], ctorParameters: () => [{ type: i2$3.IconService }], propDecorators: { name: [{
                 type: Input
             }], title: [{
                 type: Input
@@ -13622,7 +13795,7 @@ class RadioComponent {
         }
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.20", ngImport: i0, type: RadioComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.20", type: RadioComponent, isStandalone: false, selector: "v-radio", inputs: { name: "name", title: "title", titleTranslationKey: "titleTranslationKey", defaultValue: "defaultValue", widthPx: "widthPx", fullWidth: "fullWidth", margin: "margin", smallMargin: "smallMargin", disabled: "disabled", tooltip: "tooltip", required: "required", smallLabel: "smallLabel", rows: "rows", clear$: "clear$", radioValues: "radioValues" }, outputs: { valueChange: "valueChange" }, 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=\"v-input-container\"\n  [ngClass]=\"{\n    'v-input--margin': margin,\n    'v-input--small-margin': smallMargin,\n  }\"\n  (click)=\"stopRadioEventPropagation($event)\"\n>\n  <ng-container *ngTemplateOutlet=\"inputTitle\"></ng-container>\n  <ng-container *ngTemplateOutlet=\"radioInput\"></ng-container>\n</div>\n\n<ng-template #inputTitle>\n  <v-input-label\n    *ngIf=\"title || titleTranslationKey\"\n    [title]=\"title\"\n    [titleTranslationKey]=\"titleTranslationKey\"\n    [name]=\"name\"\n    [tooltip]=\"tooltip\"\n    [required]=\"required\"\n    [small]=\"smallLabel\"\n  >\n  </v-input-label>\n</ng-template>\n\n<ng-template #radioInput>\n  <cds-radio-group\n    [name]=\"name\"\n    [disabled]=\"disabled\"\n    [ngModel]=\"radioValue$ | async\"\n    (ngModelChange)=\"onValueChange($event)\"\n  >\n    <cds-radio *ngFor=\"let radio of radioValues\" [value]=\"radio.value\" [disabled]=\"radio.disabled\">\n      {{ radio.titleTranslationKey ? (radio.titleTranslationKey | translate) : radio.title }}\n    </cds-radio>\n  </cds-radio-group>\n</ng-template>\n", styles: [".v-input-container{display:flex;flex-direction:column}.v-input__label{margin:0;font-size:var(--v-input-title-font-size);color:var(--v-input-title-font-color);line-height:var(--v-input-title-line-height);font-weight:var(--v-input-title-font-weight);margin-block-end:var(--v-input-title-margin)}.v-input{all:unset;font-size:var(--v-input-font-size);line-height:var(--v-input-line-height);color:var(--v-input-color);font-weight:var(--v-input-font-weight);padding-block-start:var(--v-input-padding-block);padding-block-end:var(--v-input-padding-block);padding-inline-start:var(--v-input-padding-inline);padding-inline-end:var(--v-input-padding-inline);background-color:var(--v-input-bg-color);border-radius:var(--v-input-border-radius);border:var(--v-input-border);transition:var(--v-input-transition);width:var(--v-input-default-width);box-sizing:border-box}.v-input:focus{outline:var(--v-input-focus-border);outline-offset:var(--v-outline-offset)}.v-input:disabled{color:var(--v-input-font-color-disabled);cursor:var(--v-input-disabled-cursor)}.v-input--full-width{width:100%}.v-input--margin{margin-block-end:var(--v-input-margin)}.v-input--small-margin{margin-block-end:var(--v-input-small-margin)}.v-input__password-container{display:flex;flex-direction:row;align-items:center}.v-input__password-icon{margin-inline-start:var(--v-input-password-icon-spacing)}.v-input--hide-spinbox::-webkit-outer-spin-button,.v-input--hide-spinbox::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}.v-input--hide-spinbox{-moz-appearance:textfield}.v-input--checkbox{width:20px;height:20px;margin-block-end:var(--v-input-margin)}\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: "directive", type: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: InputLabelComponent, selector: "v-input-label", inputs: ["name", "tooltip", "tooltipTranslationKey", "largeMargin", "small", "noMargin", "title", "titleTranslationKey", "required", "disabled", "carbonTheme"] }, { kind: "component", type: i2$2.Radio, selector: "cds-radio, ibm-radio", inputs: ["checked", "name", "disabled", "labelPlacement", "ariaLabelledby", "ariaLabel", "required", "value", "skeleton", "id"], outputs: ["change"] }, { kind: "component", type: i2$2.RadioGroup, selector: "cds-radio-group, ibm-radio-group", inputs: ["selected", "value", "name", "disabled", "skeleton", "orientation", "labelPlacement", "legend", "ariaLabel", "ariaLabelledby", "helperText", "invalid", "invalidText", "warn", "warnText"], outputs: ["change"] }, { kind: "pipe", type: i1$4.AsyncPipe, name: "async" }, { kind: "pipe", type: i1.TranslatePipe, name: "translate" }] }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.20", type: RadioComponent, isStandalone: false, selector: "v-radio", inputs: { name: "name", title: "title", titleTranslationKey: "titleTranslationKey", defaultValue: "defaultValue", widthPx: "widthPx", fullWidth: "fullWidth", margin: "margin", smallMargin: "smallMargin", disabled: "disabled", tooltip: "tooltip", required: "required", smallLabel: "smallLabel", rows: "rows", clear$: "clear$", radioValues: "radioValues" }, outputs: { valueChange: "valueChange" }, 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=\"v-input-container\"\n  [ngClass]=\"{\n    'v-input--margin': margin,\n    'v-input--small-margin': smallMargin,\n  }\"\n  (click)=\"stopRadioEventPropagation($event)\"\n>\n  <ng-container *ngTemplateOutlet=\"inputTitle\"></ng-container>\n  <ng-container *ngTemplateOutlet=\"radioInput\"></ng-container>\n</div>\n\n<ng-template #inputTitle>\n  <v-input-label\n    *ngIf=\"title || titleTranslationKey\"\n    [title]=\"title\"\n    [titleTranslationKey]=\"titleTranslationKey\"\n    [name]=\"name\"\n    [tooltip]=\"tooltip\"\n    [required]=\"required\"\n    [small]=\"smallLabel\"\n  >\n  </v-input-label>\n</ng-template>\n\n<ng-template #radioInput>\n  <cds-radio-group\n    [name]=\"name\"\n    [disabled]=\"disabled\"\n    [ngModel]=\"radioValue$ | async\"\n    (ngModelChange)=\"onValueChange($event)\"\n  >\n    <cds-radio *ngFor=\"let radio of radioValues\" [value]=\"radio.value\" [disabled]=\"radio.disabled\">\n      {{ radio.titleTranslationKey ? (radio.titleTranslationKey | translate) : radio.title }}\n    </cds-radio>\n  </cds-radio-group>\n</ng-template>\n", styles: [".v-input-container{display:flex;flex-direction:column}.v-input__label{margin:0;font-size:var(--v-input-title-font-size);color:var(--v-input-title-font-color);line-height:var(--v-input-title-line-height);font-weight:var(--v-input-title-font-weight);margin-block-end:var(--v-input-title-margin)}.v-input{all:unset;font-size:var(--v-input-font-size);line-height:var(--v-input-line-height);color:var(--v-input-color);font-weight:var(--v-input-font-weight);padding-block-start:var(--v-input-padding-block);padding-block-end:var(--v-input-padding-block);padding-inline-start:var(--v-input-padding-inline);padding-inline-end:var(--v-input-padding-inline);background-color:var(--v-input-bg-color);border-radius:var(--v-input-border-radius);border:var(--v-input-border);transition:var(--v-input-transition);width:var(--v-input-default-width);box-sizing:border-box}.v-input:focus{outline:var(--v-input-focus-border);outline-offset:var(--v-outline-offset)}.v-input:disabled{color:var(--v-input-font-color-disabled);cursor:var(--v-input-disabled-cursor)}.v-input--full-width{width:100%}.v-input--margin{margin-block-end:var(--v-input-margin)}.v-input--small-margin{margin-block-end:var(--v-input-small-margin)}.v-input__password-container{display:flex;flex-direction:row;align-items:center}.v-input__password-icon{margin-inline-start:var(--v-input-password-icon-spacing)}.v-input--hide-spinbox::-webkit-outer-spin-button,.v-input--hide-spinbox::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}.v-input--hide-spinbox{-moz-appearance:textfield}.v-input--checkbox{width:20px;height:20px;margin-block-end:var(--v-input-margin)}\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: "directive", type: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: InputLabelComponent, selector: "v-input-label", inputs: ["name", "tooltip", "tooltipTranslationKey", "largeMargin", "small", "noMargin", "title", "titleTranslationKey", "required", "disabled", "carbonTheme"] }, { kind: "component", type: i2$3.Radio, selector: "cds-radio, ibm-radio", inputs: ["checked", "name", "disabled", "labelPlacement", "ariaLabelledby", "ariaLabel", "required", "value", "skeleton", "id"], outputs: ["change"] }, { kind: "component", type: i2$3.RadioGroup, selector: "cds-radio-group, ibm-radio-group", inputs: ["selected", "value", "name", "disabled", "skeleton", "orientation", "labelPlacement", "legend", "ariaLabel", "ariaLabelledby", "helperText", "invalid", "invalidText", "warn", "warnText"], outputs: ["change"] }, { kind: "pipe", type: i1$4.AsyncPipe, name: "async" }, { kind: "pipe", type: i1.TranslatePipe, name: "translate" }] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.20", ngImport: i0, type: RadioComponent, decorators: [{
             type: Component,
@@ -13733,7 +13906,7 @@ class FormComponent {
             }
             return of(null);
         }))
-            .pipe(tap(inputValues => {
+            .pipe(tap$1(inputValues => {
             const valuesObject = {};
             valueComponents.forEach((component, index) => {
                 valuesObject[component.name] = inputValues[index];
@@ -14012,13 +14185,13 @@ class SearchFieldsComponent {
             this.expand();
         }
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.20", ngImport: i0, type: SearchFieldsComponent, deps: [{ token: i3$1.DocumentService }, { token: i1.TranslateService }, { token: i2$2.IconService }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.20", type: SearchFieldsComponent, isStandalone: false, selector: "valtimo-search-fields", inputs: { loading: "loading", searchFields: "searchFields", caseDefinitionKey: "caseDefinitionKey", setValuesSubject$: "setValuesSubject$", clearValuesSubject$: "clearValuesSubject$", defaultValues: "defaultValues", disableSaveSearch: "disableSaveSearch", inputDisabled: "inputDisabled", externalSearchField: "externalSearchField", canSaveSearch: "canSaveSearch" }, outputs: { doSearch: "doSearch", saveSearchEvent: "saveSearchEvent", clearEvent: "clearEvent" }, 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<ng-container *ngIf=\"loading\">\n  <ng-container *ngTemplateOutlet=\"loadingTemplate\"></ng-container>\n</ng-container>\n\n<ng-container *ngIf=\"!loading\">\n  <cds-accordion>\n    <cds-accordion-item\n      [title]=\"'searchFields.searchButtonText' | translate\"\n      (selected)=\"toggleExpanded()\"\n      [expanded]=\"expanded$ | async\"\n    >\n      <ng-container *ngTemplateOutlet=\"searchFieldsTemplate\"></ng-container>\n    </cds-accordion-item>\n  </cds-accordion>\n</ng-container>\n\n<ng-template #loadingTemplate>\n  <div class=\"loading-container\"><cds-loading></cds-loading></div>\n</ng-template>\n\n<ng-template #searchFieldsTemplate>\n  <ng-container *ngIf=\"searchFields$ | async as searchFields\">\n    <ng-container\n      *ngIf=\"{\n        noSearchFields: (!searchFields || searchFields.length === 0) && !externalSearchField,\n      } as vars\"\n    >\n      <div\n        *ngIf=\"!vars.noSearchFields\"\n        class=\"search-fields-container\"\n        [ngClass]=\"{'search-fields-container--hidden': (expanded$ | async) === false}\"\n        [cdsLayer]=\"1\"\n      >\n        <ng-content></ng-content>\n\n        <ng-container *ngFor=\"let searchField of searchFields\">\n          <div class=\"search-field-container\">\n            <ng-container\n              *ngTemplateOutlet=\"searchFieldTemplate; context: {searchField: searchField}\"\n            ></ng-container>\n          </div>\n        </ng-container>\n      </div>\n\n      <div class=\"meta-container\" *ngIf=\"expanded$ | async\">\n        <ng-container\n          *ngTemplateOutlet=\"buttonsTemplate; context: {noSearchFields: vars.noSearchFields}\"\n        ></ng-container>\n      </div>\n    </ng-container>\n  </ng-container>\n</ng-template>\n\n<ng-template #searchFieldTemplate let-searchField=\"searchField\">\n  <ng-container\n    *ngIf=\"{\n      values: values$ | async,\n      tooltipKey: 'searchFieldsTooltips.' + searchField.key,\n      tooltip: 'searchFieldsTooltips.' + searchField.key | translate,\n      searchField,\n      title:\n        searchField.title ||\n        ('searchFields.' + searchField.key !== ('searchFields.' + searchField.key | translate)\n          ? ('searchFields.' + searchField.key | translate)\n          : searchField.key),\n    } as vars\"\n  >\n    <ng-container\n      *ngTemplateOutlet=\"\n        searchFieldTemplateText;\n        context: {\n          searchField: searchField,\n          tooltipKey: vars.tooltipKey,\n          tooltip: vars.tooltip,\n          title: vars.title,\n          values: vars.values,\n        }\n      \"\n    ></ng-container>\n    <ng-container\n      *ngTemplateOutlet=\"\n        searchFieldTemplateNumber;\n        context: {\n          searchField: searchField,\n          tooltipKey: vars.tooltipKey,\n          tooltip: vars.tooltip,\n          title: vars.title,\n          values: vars.values,\n        }\n      \"\n    ></ng-container>\n    <ng-container\n      *ngTemplateOutlet=\"\n        searchFieldTemplateDate;\n        context: {\n          searchField: searchField,\n          tooltipKey: vars.tooltipKey,\n          tooltip: vars.tooltip,\n          title: vars.title,\n          values: vars.values,\n        }\n      \"\n    ></ng-container>\n    <ng-container\n      *ngTemplateOutlet=\"\n        searchFieldTemplateBoolean;\n        context: {\n          searchField: searchField,\n          tooltipKey: vars.tooltipKey,\n          tooltip: vars.tooltip,\n          title: vars.title,\n          values: vars.values,\n        }\n      \"\n    ></ng-container>\n    <ng-container\n      *ngTemplateOutlet=\"\n        searchFieldTemplateDateTime;\n        context: {\n          searchField: searchField,\n          tooltipKey: vars.tooltipKey,\n          tooltip: vars.tooltip,\n          title: vars.title,\n          values: vars.values,\n        }\n      \"\n    ></ng-container>\n    <ng-container\n      *ngTemplateOutlet=\"\n        searchFieldTemplateNumberRange;\n        context: {\n          searchField: searchField,\n          tooltipKey: vars.tooltipKey,\n          tooltip: vars.tooltip,\n          title: vars.title,\n          values: vars.values,\n        }\n      \"\n    ></ng-container>\n    <ng-container\n      *ngTemplateOutlet=\"\n        searchFieldTemplateTextRange;\n        context: {\n          searchField: searchField,\n          tooltipKey: vars.tooltipKey,\n          tooltip: vars.tooltip,\n          title: vars.title,\n          values: vars.values,\n        }\n      \"\n    ></ng-container>\n    <ng-container\n      *ngTemplateOutlet=\"\n        searchFieldTemplateDateRange;\n        context: {\n          searchField: searchField,\n          tooltipKey: vars.tooltipKey,\n          tooltip: vars.tooltip,\n          title: vars.title,\n          values: vars.values,\n        }\n      \"\n    ></ng-container>\n    <ng-container\n      *ngTemplateOutlet=\"\n        searchFieldTemplateDateTimeRange;\n        context: {\n          searchField: searchField,\n          tooltipKey: vars.tooltipKey,\n          tooltip: vars.tooltip,\n          title: vars.title,\n          values: vars.values,\n        }\n      \"\n    ></ng-container>\n    <ng-container\n      *ngTemplateOutlet=\"\n        searchFieldTemplateSingleSelectDropdown;\n        context: {\n          searchField: searchField,\n          tooltipKey: vars.tooltipKey,\n          tooltip: vars.tooltip,\n          title: vars.title,\n          values: vars.values,\n        }\n      \"\n    ></ng-container>\n    <ng-container\n      *ngTemplateOutlet=\"\n        searchFieldTemplateMultiSelectDropdown;\n        context: {\n          searchField: searchField,\n          tooltipKey: vars.tooltipKey,\n          tooltip: vars.tooltip,\n          title: vars.title,\n          values: vars.values,\n        }\n      \"\n    ></ng-container>\n  </ng-container>\n</ng-template>\n\n<ng-template\n  #searchFieldTemplateText\n  let-searchField=\"searchField\"\n  let-tooltip=\"tooltip\"\n  let-tooltipKey=\"tooltipKey\"\n  let-title=\"title\"\n  let-values=\"values\"\n>\n  <v-input\n    *ngIf=\"searchField.dataType === 'text' && searchField.fieldType === 'single'\"\n    [dataTestId]=\"'search-field-' + searchField.key\"\n    [name]=\"searchField.key\"\n    [title]=\"title\"\n    [fullWidth]=\"true\"\n    [tooltip]=\"tooltip !== tooltipKey && tooltip\"\n    (valueChange)=\"singleValueChange(searchField.key, $event)\"\n    [smallLabel]=\"true\"\n    [clear$]=\"clear$\"\n    (keyup.enter)=\"search()\"\n    [defaultValue]=\"values[searchField.key]\"\n    [disabled]=\"inputDisabled\"\n  >\n  </v-input>\n</ng-template>\n\n<ng-template\n  #searchFieldTemplateNumber\n  let-searchField=\"searchField\"\n  let-tooltip=\"tooltip\"\n  let-tooltipKey=\"tooltipKey\"\n  let-title=\"title\"\n  let-values=\"values\"\n>\n  <v-input\n    *ngIf=\"searchField.dataType === 'number' && searchField.fieldType === 'single'\"\n    [dataTestId]=\"'search-field-' + searchField.key\"\n    [name]=\"searchField.key\"\n    [title]=\"title\"\n    [fullWidth]=\"true\"\n    (valueChange)=\"singleValueChange(searchField.key, $event)\"\n    type=\"number\"\n    [hideNumberSpinBox]=\"true\"\n    [tooltip]=\"tooltip !== tooltipKey && tooltip\"\n    [smallLabel]=\"true\"\n    [clear$]=\"clear$\"\n    (keyup.enter)=\"search()\"\n    [defaultValue]=\"values[searchField.key]\"\n    [disabled]=\"inputDisabled\"\n  >\n  </v-input>\n</ng-template>\n\n<ng-template\n  #searchFieldTemplateDate\n  let-searchField=\"searchField\"\n  let-tooltip=\"tooltip\"\n  let-tooltipKey=\"tooltipKey\"\n  let-title=\"title\"\n  let-values=\"values\"\n>\n  <v-date-picker\n    *ngIf=\"searchField.dataType === 'date' && searchField.fieldType === 'single'\"\n    [title]=\"title\"\n    [tooltip]=\"tooltip !== tooltipKey && tooltip\"\n    [name]=\"searchField.key\"\n    fullWidth=\"true\"\n    (valueChange)=\"singleValueChange(searchField.key, $event)\"\n    [smallLabel]=\"true\"\n    [clear$]=\"clear$\"\n    (keyup.enter)=\"search()\"\n    [defaultDate]=\"values[searchField.key]\"\n    [disabled]=\"inputDisabled\"\n  ></v-date-picker>\n</ng-template>\n\n<ng-template\n  #searchFieldTemplateTextRange\n  let-searchField=\"searchField\"\n  let-tooltip=\"tooltip\"\n  let-tooltipKey=\"tooltipKey\"\n  let-title=\"title\"\n  let-values=\"values\"\n>\n  <ng-container *ngIf=\"searchField.dataType === 'text' && searchField.fieldType === 'range'\">\n    <v-input-label\n      [title]=\"title\"\n      [tooltip]=\"tooltip !== tooltipKey && tooltip\"\n      [small]=\"true\"\n    ></v-input-label>\n    <v-form\n      (valueChange)=\"multipleValueChange(searchField.key, $event)\"\n      className=\"multiple-search-fields\"\n    >\n      <v-input\n        name=\"start\"\n        [dataTestId]=\"'search-field-' + searchField.key\"\n        [fullWidth]=\"true\"\n        [clear$]=\"clear$\"\n        (keyup.enter)=\"search()\"\n        [defaultValue]=\"values[searchField.key]?.start\"\n        [disabled]=\"inputDisabled\"\n      >\n      </v-input>\n      <ng-container *ngTemplateOutlet=\"toText\"></ng-container>\n      <v-input\n        name=\"end\"\n        [dataTestId]=\"'search-field-' + searchField.key\"\n        [fullWidth]=\"true\"\n        [clear$]=\"clear$\"\n        (keyup.enter)=\"search()\"\n        [defaultValue]=\"values[searchField.key]?.end\"\n        [disabled]=\"inputDisabled\"\n      >\n      </v-input>\n    </v-form>\n  </ng-container>\n</ng-template>\n\n<ng-template\n  #searchFieldTemplateNumberRange\n  let-searchField=\"searchField\"\n  let-tooltip=\"tooltip\"\n  let-tooltipKey=\"tooltipKey\"\n  let-title=\"title\"\n  let-values=\"values\"\n>\n  <ng-container *ngIf=\"searchField.dataType === 'number' && searchField.fieldType === 'range'\">\n    <v-input-label\n      [title]=\"title\"\n      [tooltip]=\"tooltip !== tooltipKey && tooltip\"\n      [small]=\"true\"\n    ></v-input-label>\n    <v-form\n      (valueChange)=\"multipleValueChange(searchField.key, $event)\"\n      className=\"multiple-search-fields\"\n    >\n      <v-input\n        name=\"start\"\n        [dataTestId]=\"'search-field-' + searchField.key\"\n        [fullWidth]=\"true\"\n        type=\"number\"\n        [hideNumberSpinBox]=\"true\"\n        [clear$]=\"clear$\"\n        (keyup.enter)=\"search()\"\n        [defaultValue]=\"values[searchField.key]?.start\"\n        [disabled]=\"inputDisabled\"\n      >\n      </v-input>\n      <ng-container *ngTemplateOutlet=\"toText\"></ng-container>\n      <v-input\n        name=\"end\"\n        [dataTestId]=\"'search-field-' + searchField.key\"\n        [fullWidth]=\"true\"\n        type=\"number\"\n        [hideNumberSpinBox]=\"true\"\n        [clear$]=\"clear$\"\n        (keyup.enter)=\"search()\"\n        [defaultValue]=\"values[searchField.key]?.end\"\n        [disabled]=\"inputDisabled\"\n      >\n      </v-input>\n    </v-form>\n  </ng-container>\n</ng-template>\n\n<ng-template\n  #searchFieldTemplateDateRange\n  let-searchField=\"searchField\"\n  let-tooltip=\"tooltip\"\n  let-tooltipKey=\"tooltipKey\"\n  let-title=\"title\"\n  let-values=\"values\"\n>\n  <ng-container *ngIf=\"searchField.dataType === 'date' && searchField.fieldType === 'range'\">\n    <v-input-label\n      [title]=\"title\"\n      [tooltip]=\"tooltip !== tooltipKey && tooltip\"\n      [small]=\"true\"\n    ></v-input-label>\n    <v-form\n      (valueChange)=\"multipleValueChange(searchField.key, $event)\"\n      className=\"multiple-search-fields\"\n    >\n      <v-date-picker\n        name=\"start\"\n        fullWidth=\"true\"\n        [clear$]=\"clear$\"\n        (keyup.enter)=\"search()\"\n        [defaultDate]=\"values[searchField.key]?.start\"\n        [disabled]=\"inputDisabled\"\n      ></v-date-picker>\n      <ng-container *ngTemplateOutlet=\"toText\"></ng-container>\n      <v-date-picker\n        name=\"end\"\n        fullWidth=\"true\"\n        [clear$]=\"clear$\"\n        (keyup.enter)=\"search()\"\n        [defaultDate]=\"values[searchField.key]?.end\"\n        [disabled]=\"inputDisabled\"\n      ></v-date-picker>\n    </v-form>\n  </ng-container>\n</ng-template>\n\n<ng-template\n  #searchFieldTemplateBoolean\n  let-searchField=\"searchField\"\n  let-tooltip=\"tooltip\"\n  let-tooltipKey=\"tooltipKey\"\n  let-title=\"title\"\n  let-values=\"values\"\n>\n  <ng-container *ngIf=\"searchField.dataType === 'boolean'\">\n    <v-input-label\n      [title]=\"title\"\n      [tooltip]=\"tooltip !== tooltipKey && tooltip\"\n      [small]=\"true\"\n    ></v-input-label>\n    <v-select\n      *ngIf=\"booleanItems$ | async as booleanItems\"\n      [items]=\"booleanItems\"\n      [margin]=\"false\"\n      [required]=\"false\"\n      [name]=\"searchField.key\"\n      [clearSelectionSubject$]=\"clear$\"\n      (selectedChange)=\"singleValueChange(searchField.key, $event)\"\n      (keyup.enter)=\"search()\"\n      [defaultSelectionId]=\"getDefaultBooleanSelectionId(values, searchField.key)\"\n      [disabled]=\"inputDisabled\"\n      [appendInline]=\"false\"\n    ></v-select>\n  </ng-container>\n</ng-template>\n\n<ng-template\n  #searchFieldTemplateDateTime\n  let-searchField=\"searchField\"\n  let-tooltip=\"tooltip\"\n  let-tooltipKey=\"tooltipKey\"\n  let-title=\"title\"\n  let-values=\"values\"\n>\n  <v-date-picker\n    *ngIf=\"searchField.dataType === 'datetime' && searchField.fieldType === 'single'\"\n    [title]=\"title\"\n    [tooltip]=\"tooltip !== tooltipKey && tooltip\"\n    [name]=\"searchField.key\"\n    fullWidth=\"true\"\n    (valueChange)=\"singleValueChange(searchField.key, $event, true)\"\n    [smallLabel]=\"true\"\n    [enableTime]=\"true\"\n    [clear$]=\"clear$\"\n    (keyup.enter)=\"search()\"\n    [defaultDate]=\"values[searchField.key]\"\n    [disabled]=\"inputDisabled\"\n  ></v-date-picker>\n</ng-template>\n\n<ng-template\n  #searchFieldTemplateDateTimeRange\n  let-searchField=\"searchField\"\n  let-tooltip=\"tooltip\"\n  let-tooltipKey=\"tooltipKey\"\n  let-title=\"title\"\n  let-values=\"values\"\n>\n  <ng-container *ngIf=\"searchField.dataType === 'datetime' && searchField.fieldType === 'range'\">\n    <v-input-label\n      [title]=\"title\"\n      [tooltip]=\"tooltip !== tooltipKey && tooltip\"\n      [small]=\"true\"\n    ></v-input-label>\n    <v-form\n      (valueChange)=\"multipleValueChange(searchField.key, $event, true)\"\n      className=\"multiple-search-fields\"\n    >\n      <v-date-picker\n        name=\"start\"\n        fullWidth=\"true\"\n        [enableTime]=\"true\"\n        [clear$]=\"clear$\"\n        (keyup.enter)=\"search()\"\n        [defaultDate]=\"values[searchField.key]?.start\"\n        [disabled]=\"inputDisabled\"\n      ></v-date-picker>\n      <ng-container *ngTemplateOutlet=\"toText\"></ng-container>\n      <v-date-picker\n        name=\"end\"\n        fullWidth=\"true\"\n        [enableTime]=\"true\"\n        [clear$]=\"clear$\"\n        (keyup.enter)=\"search()\"\n        [defaultDate]=\"values[searchField.key]?.end\"\n        [disabled]=\"inputDisabled\"\n      ></v-date-picker>\n    </v-form>\n  </ng-container>\n</ng-template>\n\n<ng-template\n  #searchFieldTemplateSingleSelectDropdown\n  let-searchField=\"searchField\"\n  let-tooltip=\"tooltip\"\n  let-tooltipKey=\"tooltipKey\"\n  let-title=\"title\"\n  let-values=\"values\"\n>\n  <ng-container\n    *ngIf=\"\n      searchField.dataType === 'text' &&\n      (searchField.fieldType === 'single-select-dropdown' ||\n        searchField.fieldType === 'single_select_dropdown')\n    \"\n  >\n    <v-input-label\n      [title]=\"title\"\n      [tooltip]=\"tooltip !== tooltipKey && tooltip\"\n      [small]=\"true\"\n    ></v-input-label>\n    <v-select\n      *ngIf=\"dropdownSelectItemsMap[searchField.key] as searchFieldSelectItems\"\n      [items]=\"searchFieldSelectItems\"\n      [margin]=\"false\"\n      [required]=\"false\"\n      [name]=\"searchField.key\"\n      [clearSelectionSubject$]=\"clear$\"\n      (selectedChange)=\"singleValueChange(searchField.key, $event)\"\n      (keyup.enter)=\"search()\"\n      [defaultSelectionId]=\"values[searchField.key]\"\n      [disabled]=\"inputDisabled\"\n      [appendInline]=\"false\"\n    ></v-select>\n  </ng-container>\n</ng-template>\n\n<ng-template\n  #searchFieldTemplateMultiSelectDropdown\n  let-searchField=\"searchField\"\n  let-tooltip=\"tooltip\"\n  let-tooltipKey=\"tooltipKey\"\n  let-title=\"title\"\n  let-values=\"values\"\n>\n  <ng-container\n    *ngIf=\"\n      searchField.dataType === 'text' &&\n      (searchField.fieldType === 'multi-select-dropdown' ||\n        searchField.fieldType === 'multi_select_dropdown')\n    \"\n  >\n    <v-input-label\n      [title]=\"title\"\n      [tooltip]=\"tooltip !== tooltipKey && tooltip\"\n      [small]=\"true\"\n    ></v-input-label>\n    <v-select\n      *ngIf=\"dropdownSelectItemsMap[searchField.key] as searchFieldSelectItems\"\n      [items]=\"searchFieldSelectItems\"\n      [margin]=\"false\"\n      [multiple]=\"true\"\n      [required]=\"false\"\n      [name]=\"searchField.key\"\n      [clearSelectionSubject$]=\"clear$\"\n      (selectedChange)=\"multipleValueChange(searchField.key, $event)\"\n      (keyup.enter)=\"search()\"\n      [defaultSelectionIds]=\"values[searchField.key]\"\n      [disabled]=\"inputDisabled\"\n      [appendInline]=\"false\"\n    ></v-select>\n  </ng-container>\n</ng-template>\n\n<ng-template #toText>\n  <div class=\"to-text\">\n    <v-paragraph>{{ 'searchFields.to' | translate }}</v-paragraph>\n  </div>\n</ng-template>\n\n<ng-template #buttonsTemplate let-noSearchFields=\"noSearchFields\">\n  <ng-container\n    *ngTemplateOutlet=\"noSearchFieldsTemplate; context: {noSearchFields: noSearchFields}\"\n  ></ng-container>\n\n  <div\n    class=\"buttons-container\"\n    *ngIf=\"\n      !noSearchFields && {expanded: expanded$ | async, isSearchEmpty: isSearchEmpty$ | async} as obs\n    \"\n  >\n    <div class=\"right-buttons\">\n      <button\n        *ngIf=\"obs.expanded\"\n        cdsButton=\"tertiary\"\n        data-testid=\"search-fields-clear-button\"\n        (click)=\"clear()\"\n        [disabled]=\"loading || noSearchFields || inputDisabled\"\n        type=\"button\"\n        id=\"clear\"\n      >\n        <svg cdsIcon=\"trash-can\" size=\"16\" class=\"cds--btn__icon\"></svg>\n\n        {{ 'searchFields.clearButtonText' | translate }}\n      </button>\n\n      <button\n        *ngIf=\"obs.expanded && canSaveSearch\"\n        cdsButton=\"secondary\"\n        data-testid=\"search-fields-save-button\"\n        [disabled]=\"disableSaveSearch && obs.isSearchEmpty\"\n        (click)=\"saveSearch()\"\n        type=\"button\"\n        id=\"save\"\n      >\n        <svg cdsIcon=\"save\" size=\"16\" class=\"cds--btn__icon\"></svg>\n\n        {{ 'searchFields.saveButtonText' | translate }}\n      </button>\n\n      <button\n        *ngIf=\"obs.expanded\"\n        cdsButton=\"primary\"\n        data-testid=\"search-fields-search-button\"\n        (click)=\"search()\"\n        [disabled]=\"\n          loading || noSearchFields || (hasValidValues$ | async) === false || inputDisabled\n        \"\n        type=\"button\"\n        id=\"search\"\n      >\n        <svg cdsIcon=\"search\" size=\"16\" class=\"cds--btn__icon\"></svg>\n\n        {{ 'searchFields.searchButtonText' | translate }}\n      </button>\n    </div>\n  </div>\n</ng-template>\n\n<ng-template #noSearchFieldsTemplate let-noSearchFields=\"noSearchFields\">\n  <div class=\"no-search-fields-message\" *ngIf=\"noSearchFields\">\n    <v-paragraph dataTestId=\"search-fields-no-fields\" [fullWidth]=\"true\" [center]=\"true\">{{\n      'searchFields.noneConfigured' | translate\n    }}</v-paragraph>\n  </div>\n</ng-template>\n", styles: ["::ng-deep .multiple-search-fields{display:flex!important;flex-direction:row!important;align-items:center}.to-text{margin-inline-start:8px;margin-inline-end:8px}.buttons-container{width:100%;display:flex;justify-content:flex-end}.right-buttons{display:flex;flex-direction:row;gap:16px}.search-fields-container{padding-bottom:16px;padding-top:16px;display:grid;gap:16px;grid-template-columns:repeat(3,1fr)}.search-fields-container--hidden{display:none}.meta-container{width:100%;padding-bottom:16px}.loading-container{display:flex;width:100%;justify-content:center}.no-search-fields-message{display:flex;width:100%;justify-content:center;margin-top:16px}.search-fields-tile{padding:0}::ng-deep .cds--accordion{background-color:var(--cds-layer)}::ng-deep .cds--accordion__item{border-inline-start:1px solid var(--cds-border-subtle);border-inline-end:1px solid var(--cds-border-subtle)}::ng-deep .cds--accordion__content{padding:0 16px}\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: 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: "component", type: FormComponent, selector: "v-form", inputs: ["className"], outputs: ["valueChange"] }, { 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"] }, { kind: "component", type: InputLabelComponent, selector: "v-input-label", inputs: ["name", "tooltip", "tooltipTranslationKey", "largeMargin", "small", "noMargin", "title", "titleTranslationKey", "required", "disabled", "carbonTheme"] }, { kind: "component", type: ParagraphComponent, selector: "v-paragraph", inputs: ["center", "fullWidth", "margin", "italic", "loading", "dataTestId"] }, { kind: "directive", type: i2$2.Button, selector: "[cdsButton], [ibmButton]", inputs: ["ibmButton", "cdsButton", "size", "skeleton", "iconOnly", "isExpressive"] }, { 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: "component", type: i2$2.Accordion, selector: "cds-accordion, ibm-accordion", inputs: ["align", "size", "skeleton"] }, { kind: "component", type: i2$2.AccordionItem, selector: "cds-accordion-item, ibm-accordion-item", inputs: ["title", "context", "id", "skeleton", "expanded", "disabled"], outputs: ["selected"] }, { kind: "directive", type: i2$2.LayerDirective, selector: "[cdsLayer], [ibmLayer]", inputs: ["ibmLayer", "cdsLayer"], exportAs: ["layer"] }, { kind: "directive", type: i2$2.IconDirective, selector: "[cdsIcon], [ibmIcon]", inputs: ["ibmIcon", "cdsIcon", "size", "title", "ariaLabel", "ariaLabelledBy", "ariaHidden", "isFocusable"] }, { kind: "component", type: i2$2.Loading, selector: "cds-loading, ibm-loading", inputs: ["title", "isActive", "size", "overlay"] }, { kind: "pipe", type: i1$4.AsyncPipe, name: "async" }, { kind: "pipe", type: i1.TranslatePipe, name: "translate" }] }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.20", ngImport: i0, type: SearchFieldsComponent, deps: [{ token: i3$1.DocumentService }, { token: i1.TranslateService }, { token: i2$3.IconService }], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.20", type: SearchFieldsComponent, isStandalone: false, selector: "valtimo-search-fields", inputs: { loading: "loading", searchFields: "searchFields", caseDefinitionKey: "caseDefinitionKey", setValuesSubject$: "setValuesSubject$", clearValuesSubject$: "clearValuesSubject$", defaultValues: "defaultValues", disableSaveSearch: "disableSaveSearch", inputDisabled: "inputDisabled", externalSearchField: "externalSearchField", canSaveSearch: "canSaveSearch" }, outputs: { doSearch: "doSearch", saveSearchEvent: "saveSearchEvent", clearEvent: "clearEvent" }, 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<ng-container *ngIf=\"loading\">\n  <ng-container *ngTemplateOutlet=\"loadingTemplate\"></ng-container>\n</ng-container>\n\n<ng-container *ngIf=\"!loading\">\n  <cds-accordion>\n    <cds-accordion-item\n      [title]=\"'searchFields.searchButtonText' | translate\"\n      (selected)=\"toggleExpanded()\"\n      [expanded]=\"expanded$ | async\"\n    >\n      <ng-container *ngTemplateOutlet=\"searchFieldsTemplate\"></ng-container>\n    </cds-accordion-item>\n  </cds-accordion>\n</ng-container>\n\n<ng-template #loadingTemplate>\n  <div class=\"loading-container\"><cds-loading></cds-loading></div>\n</ng-template>\n\n<ng-template #searchFieldsTemplate>\n  <ng-container *ngIf=\"searchFields$ | async as searchFields\">\n    <ng-container\n      *ngIf=\"{\n        noSearchFields: (!searchFields || searchFields.length === 0) && !externalSearchField,\n      } as vars\"\n    >\n      <div\n        *ngIf=\"!vars.noSearchFields\"\n        class=\"search-fields-container\"\n        [ngClass]=\"{'search-fields-container--hidden': (expanded$ | async) === false}\"\n        [cdsLayer]=\"1\"\n      >\n        <ng-content></ng-content>\n\n        <ng-container *ngFor=\"let searchField of searchFields\">\n          <div class=\"search-field-container\">\n            <ng-container\n              *ngTemplateOutlet=\"searchFieldTemplate; context: {searchField: searchField}\"\n            ></ng-container>\n          </div>\n        </ng-container>\n      </div>\n\n      <div class=\"meta-container\" *ngIf=\"expanded$ | async\">\n        <ng-container\n          *ngTemplateOutlet=\"buttonsTemplate; context: {noSearchFields: vars.noSearchFields}\"\n        ></ng-container>\n      </div>\n    </ng-container>\n  </ng-container>\n</ng-template>\n\n<ng-template #searchFieldTemplate let-searchField=\"searchField\">\n  <ng-container\n    *ngIf=\"{\n      values: values$ | async,\n      tooltipKey: 'searchFieldsTooltips.' + searchField.key,\n      tooltip: 'searchFieldsTooltips.' + searchField.key | translate,\n      searchField,\n      title:\n        searchField.title ||\n        ('searchFields.' + searchField.key !== ('searchFields.' + searchField.key | translate)\n          ? ('searchFields.' + searchField.key | translate)\n          : searchField.key),\n    } as vars\"\n  >\n    <ng-container\n      *ngTemplateOutlet=\"\n        searchFieldTemplateText;\n        context: {\n          searchField: searchField,\n          tooltipKey: vars.tooltipKey,\n          tooltip: vars.tooltip,\n          title: vars.title,\n          values: vars.values,\n        }\n      \"\n    ></ng-container>\n    <ng-container\n      *ngTemplateOutlet=\"\n        searchFieldTemplateNumber;\n        context: {\n          searchField: searchField,\n          tooltipKey: vars.tooltipKey,\n          tooltip: vars.tooltip,\n          title: vars.title,\n          values: vars.values,\n        }\n      \"\n    ></ng-container>\n    <ng-container\n      *ngTemplateOutlet=\"\n        searchFieldTemplateDate;\n        context: {\n          searchField: searchField,\n          tooltipKey: vars.tooltipKey,\n          tooltip: vars.tooltip,\n          title: vars.title,\n          values: vars.values,\n        }\n      \"\n    ></ng-container>\n    <ng-container\n      *ngTemplateOutlet=\"\n        searchFieldTemplateBoolean;\n        context: {\n          searchField: searchField,\n          tooltipKey: vars.tooltipKey,\n          tooltip: vars.tooltip,\n          title: vars.title,\n          values: vars.values,\n        }\n      \"\n    ></ng-container>\n    <ng-container\n      *ngTemplateOutlet=\"\n        searchFieldTemplateDateTime;\n        context: {\n          searchField: searchField,\n          tooltipKey: vars.tooltipKey,\n          tooltip: vars.tooltip,\n          title: vars.title,\n          values: vars.values,\n        }\n      \"\n    ></ng-container>\n    <ng-container\n      *ngTemplateOutlet=\"\n        searchFieldTemplateNumberRange;\n        context: {\n          searchField: searchField,\n          tooltipKey: vars.tooltipKey,\n          tooltip: vars.tooltip,\n          title: vars.title,\n          values: vars.values,\n        }\n      \"\n    ></ng-container>\n    <ng-container\n      *ngTemplateOutlet=\"\n        searchFieldTemplateTextRange;\n        context: {\n          searchField: searchField,\n          tooltipKey: vars.tooltipKey,\n          tooltip: vars.tooltip,\n          title: vars.title,\n          values: vars.values,\n        }\n      \"\n    ></ng-container>\n    <ng-container\n      *ngTemplateOutlet=\"\n        searchFieldTemplateDateRange;\n        context: {\n          searchField: searchField,\n          tooltipKey: vars.tooltipKey,\n          tooltip: vars.tooltip,\n          title: vars.title,\n          values: vars.values,\n        }\n      \"\n    ></ng-container>\n    <ng-container\n      *ngTemplateOutlet=\"\n        searchFieldTemplateDateTimeRange;\n        context: {\n          searchField: searchField,\n          tooltipKey: vars.tooltipKey,\n          tooltip: vars.tooltip,\n          title: vars.title,\n          values: vars.values,\n        }\n      \"\n    ></ng-container>\n    <ng-container\n      *ngTemplateOutlet=\"\n        searchFieldTemplateSingleSelectDropdown;\n        context: {\n          searchField: searchField,\n          tooltipKey: vars.tooltipKey,\n          tooltip: vars.tooltip,\n          title: vars.title,\n          values: vars.values,\n        }\n      \"\n    ></ng-container>\n    <ng-container\n      *ngTemplateOutlet=\"\n        searchFieldTemplateMultiSelectDropdown;\n        context: {\n          searchField: searchField,\n          tooltipKey: vars.tooltipKey,\n          tooltip: vars.tooltip,\n          title: vars.title,\n          values: vars.values,\n        }\n      \"\n    ></ng-container>\n  </ng-container>\n</ng-template>\n\n<ng-template\n  #searchFieldTemplateText\n  let-searchField=\"searchField\"\n  let-tooltip=\"tooltip\"\n  let-tooltipKey=\"tooltipKey\"\n  let-title=\"title\"\n  let-values=\"values\"\n>\n  <v-input\n    *ngIf=\"searchField.dataType === 'text' && searchField.fieldType === 'single'\"\n    [dataTestId]=\"'search-field-' + searchField.key\"\n    [name]=\"searchField.key\"\n    [title]=\"title\"\n    [fullWidth]=\"true\"\n    [tooltip]=\"tooltip !== tooltipKey && tooltip\"\n    (valueChange)=\"singleValueChange(searchField.key, $event)\"\n    [smallLabel]=\"true\"\n    [clear$]=\"clear$\"\n    (keyup.enter)=\"search()\"\n    [defaultValue]=\"values[searchField.key]\"\n    [disabled]=\"inputDisabled\"\n  >\n  </v-input>\n</ng-template>\n\n<ng-template\n  #searchFieldTemplateNumber\n  let-searchField=\"searchField\"\n  let-tooltip=\"tooltip\"\n  let-tooltipKey=\"tooltipKey\"\n  let-title=\"title\"\n  let-values=\"values\"\n>\n  <v-input\n    *ngIf=\"searchField.dataType === 'number' && searchField.fieldType === 'single'\"\n    [dataTestId]=\"'search-field-' + searchField.key\"\n    [name]=\"searchField.key\"\n    [title]=\"title\"\n    [fullWidth]=\"true\"\n    (valueChange)=\"singleValueChange(searchField.key, $event)\"\n    type=\"number\"\n    [hideNumberSpinBox]=\"true\"\n    [tooltip]=\"tooltip !== tooltipKey && tooltip\"\n    [smallLabel]=\"true\"\n    [clear$]=\"clear$\"\n    (keyup.enter)=\"search()\"\n    [defaultValue]=\"values[searchField.key]\"\n    [disabled]=\"inputDisabled\"\n  >\n  </v-input>\n</ng-template>\n\n<ng-template\n  #searchFieldTemplateDate\n  let-searchField=\"searchField\"\n  let-tooltip=\"tooltip\"\n  let-tooltipKey=\"tooltipKey\"\n  let-title=\"title\"\n  let-values=\"values\"\n>\n  <v-date-picker\n    *ngIf=\"searchField.dataType === 'date' && searchField.fieldType === 'single'\"\n    [title]=\"title\"\n    [tooltip]=\"tooltip !== tooltipKey && tooltip\"\n    [name]=\"searchField.key\"\n    fullWidth=\"true\"\n    (valueChange)=\"singleValueChange(searchField.key, $event)\"\n    [smallLabel]=\"true\"\n    [clear$]=\"clear$\"\n    (keyup.enter)=\"search()\"\n    [defaultDate]=\"values[searchField.key]\"\n    [disabled]=\"inputDisabled\"\n  ></v-date-picker>\n</ng-template>\n\n<ng-template\n  #searchFieldTemplateTextRange\n  let-searchField=\"searchField\"\n  let-tooltip=\"tooltip\"\n  let-tooltipKey=\"tooltipKey\"\n  let-title=\"title\"\n  let-values=\"values\"\n>\n  <ng-container *ngIf=\"searchField.dataType === 'text' && searchField.fieldType === 'range'\">\n    <v-input-label\n      [title]=\"title\"\n      [tooltip]=\"tooltip !== tooltipKey && tooltip\"\n      [small]=\"true\"\n    ></v-input-label>\n    <v-form\n      (valueChange)=\"multipleValueChange(searchField.key, $event)\"\n      className=\"multiple-search-fields\"\n    >\n      <v-input\n        name=\"start\"\n        [dataTestId]=\"'search-field-' + searchField.key\"\n        [fullWidth]=\"true\"\n        [clear$]=\"clear$\"\n        (keyup.enter)=\"search()\"\n        [defaultValue]=\"values[searchField.key]?.start\"\n        [disabled]=\"inputDisabled\"\n      >\n      </v-input>\n      <ng-container *ngTemplateOutlet=\"toText\"></ng-container>\n      <v-input\n        name=\"end\"\n        [dataTestId]=\"'search-field-' + searchField.key\"\n        [fullWidth]=\"true\"\n        [clear$]=\"clear$\"\n        (keyup.enter)=\"search()\"\n        [defaultValue]=\"values[searchField.key]?.end\"\n        [disabled]=\"inputDisabled\"\n      >\n      </v-input>\n    </v-form>\n  </ng-container>\n</ng-template>\n\n<ng-template\n  #searchFieldTemplateNumberRange\n  let-searchField=\"searchField\"\n  let-tooltip=\"tooltip\"\n  let-tooltipKey=\"tooltipKey\"\n  let-title=\"title\"\n  let-values=\"values\"\n>\n  <ng-container *ngIf=\"searchField.dataType === 'number' && searchField.fieldType === 'range'\">\n    <v-input-label\n      [title]=\"title\"\n      [tooltip]=\"tooltip !== tooltipKey && tooltip\"\n      [small]=\"true\"\n    ></v-input-label>\n    <v-form\n      (valueChange)=\"multipleValueChange(searchField.key, $event)\"\n      className=\"multiple-search-fields\"\n    >\n      <v-input\n        name=\"start\"\n        [dataTestId]=\"'search-field-' + searchField.key\"\n        [fullWidth]=\"true\"\n        type=\"number\"\n        [hideNumberSpinBox]=\"true\"\n        [clear$]=\"clear$\"\n        (keyup.enter)=\"search()\"\n        [defaultValue]=\"values[searchField.key]?.start\"\n        [disabled]=\"inputDisabled\"\n      >\n      </v-input>\n      <ng-container *ngTemplateOutlet=\"toText\"></ng-container>\n      <v-input\n        name=\"end\"\n        [dataTestId]=\"'search-field-' + searchField.key\"\n        [fullWidth]=\"true\"\n        type=\"number\"\n        [hideNumberSpinBox]=\"true\"\n        [clear$]=\"clear$\"\n        (keyup.enter)=\"search()\"\n        [defaultValue]=\"values[searchField.key]?.end\"\n        [disabled]=\"inputDisabled\"\n      >\n      </v-input>\n    </v-form>\n  </ng-container>\n</ng-template>\n\n<ng-template\n  #searchFieldTemplateDateRange\n  let-searchField=\"searchField\"\n  let-tooltip=\"tooltip\"\n  let-tooltipKey=\"tooltipKey\"\n  let-title=\"title\"\n  let-values=\"values\"\n>\n  <ng-container *ngIf=\"searchField.dataType === 'date' && searchField.fieldType === 'range'\">\n    <v-input-label\n      [title]=\"title\"\n      [tooltip]=\"tooltip !== tooltipKey && tooltip\"\n      [small]=\"true\"\n    ></v-input-label>\n    <v-form\n      (valueChange)=\"multipleValueChange(searchField.key, $event)\"\n      className=\"multiple-search-fields\"\n    >\n      <v-date-picker\n        name=\"start\"\n        fullWidth=\"true\"\n        [clear$]=\"clear$\"\n        (keyup.enter)=\"search()\"\n        [defaultDate]=\"values[searchField.key]?.start\"\n        [disabled]=\"inputDisabled\"\n      ></v-date-picker>\n      <ng-container *ngTemplateOutlet=\"toText\"></ng-container>\n      <v-date-picker\n        name=\"end\"\n        fullWidth=\"true\"\n        [clear$]=\"clear$\"\n        (keyup.enter)=\"search()\"\n        [defaultDate]=\"values[searchField.key]?.end\"\n        [disabled]=\"inputDisabled\"\n      ></v-date-picker>\n    </v-form>\n  </ng-container>\n</ng-template>\n\n<ng-template\n  #searchFieldTemplateBoolean\n  let-searchField=\"searchField\"\n  let-tooltip=\"tooltip\"\n  let-tooltipKey=\"tooltipKey\"\n  let-title=\"title\"\n  let-values=\"values\"\n>\n  <ng-container *ngIf=\"searchField.dataType === 'boolean'\">\n    <v-input-label\n      [title]=\"title\"\n      [tooltip]=\"tooltip !== tooltipKey && tooltip\"\n      [small]=\"true\"\n    ></v-input-label>\n    <v-select\n      *ngIf=\"booleanItems$ | async as booleanItems\"\n      [items]=\"booleanItems\"\n      [margin]=\"false\"\n      [required]=\"false\"\n      [name]=\"searchField.key\"\n      [clearSelectionSubject$]=\"clear$\"\n      (selectedChange)=\"singleValueChange(searchField.key, $event)\"\n      (keyup.enter)=\"search()\"\n      [defaultSelectionId]=\"getDefaultBooleanSelectionId(values, searchField.key)\"\n      [disabled]=\"inputDisabled\"\n      [appendInline]=\"false\"\n    ></v-select>\n  </ng-container>\n</ng-template>\n\n<ng-template\n  #searchFieldTemplateDateTime\n  let-searchField=\"searchField\"\n  let-tooltip=\"tooltip\"\n  let-tooltipKey=\"tooltipKey\"\n  let-title=\"title\"\n  let-values=\"values\"\n>\n  <v-date-picker\n    *ngIf=\"searchField.dataType === 'datetime' && searchField.fieldType === 'single'\"\n    [title]=\"title\"\n    [tooltip]=\"tooltip !== tooltipKey && tooltip\"\n    [name]=\"searchField.key\"\n    fullWidth=\"true\"\n    (valueChange)=\"singleValueChange(searchField.key, $event, true)\"\n    [smallLabel]=\"true\"\n    [enableTime]=\"true\"\n    [clear$]=\"clear$\"\n    (keyup.enter)=\"search()\"\n    [defaultDate]=\"values[searchField.key]\"\n    [disabled]=\"inputDisabled\"\n  ></v-date-picker>\n</ng-template>\n\n<ng-template\n  #searchFieldTemplateDateTimeRange\n  let-searchField=\"searchField\"\n  let-tooltip=\"tooltip\"\n  let-tooltipKey=\"tooltipKey\"\n  let-title=\"title\"\n  let-values=\"values\"\n>\n  <ng-container *ngIf=\"searchField.dataType === 'datetime' && searchField.fieldType === 'range'\">\n    <v-input-label\n      [title]=\"title\"\n      [tooltip]=\"tooltip !== tooltipKey && tooltip\"\n      [small]=\"true\"\n    ></v-input-label>\n    <v-form\n      (valueChange)=\"multipleValueChange(searchField.key, $event, true)\"\n      className=\"multiple-search-fields\"\n    >\n      <v-date-picker\n        name=\"start\"\n        fullWidth=\"true\"\n        [enableTime]=\"true\"\n        [clear$]=\"clear$\"\n        (keyup.enter)=\"search()\"\n        [defaultDate]=\"values[searchField.key]?.start\"\n        [disabled]=\"inputDisabled\"\n      ></v-date-picker>\n      <ng-container *ngTemplateOutlet=\"toText\"></ng-container>\n      <v-date-picker\n        name=\"end\"\n        fullWidth=\"true\"\n        [enableTime]=\"true\"\n        [clear$]=\"clear$\"\n        (keyup.enter)=\"search()\"\n        [defaultDate]=\"values[searchField.key]?.end\"\n        [disabled]=\"inputDisabled\"\n      ></v-date-picker>\n    </v-form>\n  </ng-container>\n</ng-template>\n\n<ng-template\n  #searchFieldTemplateSingleSelectDropdown\n  let-searchField=\"searchField\"\n  let-tooltip=\"tooltip\"\n  let-tooltipKey=\"tooltipKey\"\n  let-title=\"title\"\n  let-values=\"values\"\n>\n  <ng-container\n    *ngIf=\"\n      searchField.dataType === 'text' &&\n      (searchField.fieldType === 'single-select-dropdown' ||\n        searchField.fieldType === 'single_select_dropdown')\n    \"\n  >\n    <v-input-label\n      [title]=\"title\"\n      [tooltip]=\"tooltip !== tooltipKey && tooltip\"\n      [small]=\"true\"\n    ></v-input-label>\n    <v-select\n      *ngIf=\"dropdownSelectItemsMap[searchField.key] as searchFieldSelectItems\"\n      [items]=\"searchFieldSelectItems\"\n      [margin]=\"false\"\n      [required]=\"false\"\n      [name]=\"searchField.key\"\n      [clearSelectionSubject$]=\"clear$\"\n      (selectedChange)=\"singleValueChange(searchField.key, $event)\"\n      (keyup.enter)=\"search()\"\n      [defaultSelectionId]=\"values[searchField.key]\"\n      [disabled]=\"inputDisabled\"\n      [appendInline]=\"false\"\n    ></v-select>\n  </ng-container>\n</ng-template>\n\n<ng-template\n  #searchFieldTemplateMultiSelectDropdown\n  let-searchField=\"searchField\"\n  let-tooltip=\"tooltip\"\n  let-tooltipKey=\"tooltipKey\"\n  let-title=\"title\"\n  let-values=\"values\"\n>\n  <ng-container\n    *ngIf=\"\n      searchField.dataType === 'text' &&\n      (searchField.fieldType === 'multi-select-dropdown' ||\n        searchField.fieldType === 'multi_select_dropdown')\n    \"\n  >\n    <v-input-label\n      [title]=\"title\"\n      [tooltip]=\"tooltip !== tooltipKey && tooltip\"\n      [small]=\"true\"\n    ></v-input-label>\n    <v-select\n      *ngIf=\"dropdownSelectItemsMap[searchField.key] as searchFieldSelectItems\"\n      [items]=\"searchFieldSelectItems\"\n      [margin]=\"false\"\n      [multiple]=\"true\"\n      [required]=\"false\"\n      [name]=\"searchField.key\"\n      [clearSelectionSubject$]=\"clear$\"\n      (selectedChange)=\"multipleValueChange(searchField.key, $event)\"\n      (keyup.enter)=\"search()\"\n      [defaultSelectionIds]=\"values[searchField.key]\"\n      [disabled]=\"inputDisabled\"\n      [appendInline]=\"false\"\n    ></v-select>\n  </ng-container>\n</ng-template>\n\n<ng-template #toText>\n  <div class=\"to-text\">\n    <v-paragraph>{{ 'searchFields.to' | translate }}</v-paragraph>\n  </div>\n</ng-template>\n\n<ng-template #buttonsTemplate let-noSearchFields=\"noSearchFields\">\n  <ng-container\n    *ngTemplateOutlet=\"noSearchFieldsTemplate; context: {noSearchFields: noSearchFields}\"\n  ></ng-container>\n\n  <div\n    class=\"buttons-container\"\n    *ngIf=\"\n      !noSearchFields && {expanded: expanded$ | async, isSearchEmpty: isSearchEmpty$ | async} as obs\n    \"\n  >\n    <div class=\"right-buttons\">\n      <button\n        *ngIf=\"obs.expanded\"\n        cdsButton=\"tertiary\"\n        data-testid=\"search-fields-clear-button\"\n        (click)=\"clear()\"\n        [disabled]=\"loading || noSearchFields || inputDisabled\"\n        type=\"button\"\n        id=\"clear\"\n      >\n        <svg cdsIcon=\"trash-can\" size=\"16\" class=\"cds--btn__icon\"></svg>\n\n        {{ 'searchFields.clearButtonText' | translate }}\n      </button>\n\n      <button\n        *ngIf=\"obs.expanded && canSaveSearch\"\n        cdsButton=\"secondary\"\n        data-testid=\"search-fields-save-button\"\n        [disabled]=\"disableSaveSearch && obs.isSearchEmpty\"\n        (click)=\"saveSearch()\"\n        type=\"button\"\n        id=\"save\"\n      >\n        <svg cdsIcon=\"save\" size=\"16\" class=\"cds--btn__icon\"></svg>\n\n        {{ 'searchFields.saveButtonText' | translate }}\n      </button>\n\n      <button\n        *ngIf=\"obs.expanded\"\n        cdsButton=\"primary\"\n        data-testid=\"search-fields-search-button\"\n        (click)=\"search()\"\n        [disabled]=\"\n          loading || noSearchFields || (hasValidValues$ | async) === false || inputDisabled\n        \"\n        type=\"button\"\n        id=\"search\"\n      >\n        <svg cdsIcon=\"search\" size=\"16\" class=\"cds--btn__icon\"></svg>\n\n        {{ 'searchFields.searchButtonText' | translate }}\n      </button>\n    </div>\n  </div>\n</ng-template>\n\n<ng-template #noSearchFieldsTemplate let-noSearchFields=\"noSearchFields\">\n  <div class=\"no-search-fields-message\" *ngIf=\"noSearchFields\">\n    <v-paragraph dataTestId=\"search-fields-no-fields\" [fullWidth]=\"true\" [center]=\"true\">{{\n      'searchFields.noneConfigured' | translate\n    }}</v-paragraph>\n  </div>\n</ng-template>\n", styles: ["::ng-deep .multiple-search-fields{display:flex!important;flex-direction:row!important;align-items:center}.to-text{margin-inline-start:8px;margin-inline-end:8px}.buttons-container{width:100%;display:flex;justify-content:flex-end}.right-buttons{display:flex;flex-direction:row;gap:16px}.search-fields-container{padding-bottom:16px;padding-top:16px;display:grid;gap:16px;grid-template-columns:repeat(3,1fr)}.search-fields-container--hidden{display:none}.meta-container{width:100%;padding-bottom:16px}.loading-container{display:flex;width:100%;justify-content:center}.no-search-fields-message{display:flex;width:100%;justify-content:center;margin-top:16px}.search-fields-tile{padding:0}::ng-deep .cds--accordion{background-color:var(--cds-layer)}::ng-deep .cds--accordion__item{border-inline-start:1px solid var(--cds-border-subtle);border-inline-end:1px solid var(--cds-border-subtle)}::ng-deep .cds--accordion__content{padding:0 16px}\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: 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: "component", type: FormComponent, selector: "v-form", inputs: ["className"], outputs: ["valueChange"] }, { 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"] }, { kind: "component", type: InputLabelComponent, selector: "v-input-label", inputs: ["name", "tooltip", "tooltipTranslationKey", "largeMargin", "small", "noMargin", "title", "titleTranslationKey", "required", "disabled", "carbonTheme"] }, { kind: "component", type: ParagraphComponent, selector: "v-paragraph", inputs: ["center", "fullWidth", "margin", "italic", "loading", "dataTestId"] }, { kind: "directive", type: i2$3.Button, selector: "[cdsButton], [ibmButton]", inputs: ["ibmButton", "cdsButton", "size", "skeleton", "iconOnly", "isExpressive"] }, { 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: "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: "directive", type: i2$3.LayerDirective, selector: "[cdsLayer], [ibmLayer]", inputs: ["ibmLayer", "cdsLayer"], exportAs: ["layer"] }, { kind: "directive", type: i2$3.IconDirective, selector: "[cdsIcon], [ibmIcon]", inputs: ["ibmIcon", "cdsIcon", "size", "title", "ariaLabel", "ariaLabelledBy", "ariaHidden", "isFocusable"] }, { 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: i1.TranslatePipe, name: "translate" }] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.20", ngImport: i0, type: SearchFieldsComponent, decorators: [{
             type: Component,
             args: [{ selector: 'valtimo-search-fields', 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<ng-container *ngIf=\"loading\">\n  <ng-container *ngTemplateOutlet=\"loadingTemplate\"></ng-container>\n</ng-container>\n\n<ng-container *ngIf=\"!loading\">\n  <cds-accordion>\n    <cds-accordion-item\n      [title]=\"'searchFields.searchButtonText' | translate\"\n      (selected)=\"toggleExpanded()\"\n      [expanded]=\"expanded$ | async\"\n    >\n      <ng-container *ngTemplateOutlet=\"searchFieldsTemplate\"></ng-container>\n    </cds-accordion-item>\n  </cds-accordion>\n</ng-container>\n\n<ng-template #loadingTemplate>\n  <div class=\"loading-container\"><cds-loading></cds-loading></div>\n</ng-template>\n\n<ng-template #searchFieldsTemplate>\n  <ng-container *ngIf=\"searchFields$ | async as searchFields\">\n    <ng-container\n      *ngIf=\"{\n        noSearchFields: (!searchFields || searchFields.length === 0) && !externalSearchField,\n      } as vars\"\n    >\n      <div\n        *ngIf=\"!vars.noSearchFields\"\n        class=\"search-fields-container\"\n        [ngClass]=\"{'search-fields-container--hidden': (expanded$ | async) === false}\"\n        [cdsLayer]=\"1\"\n      >\n        <ng-content></ng-content>\n\n        <ng-container *ngFor=\"let searchField of searchFields\">\n          <div class=\"search-field-container\">\n            <ng-container\n              *ngTemplateOutlet=\"searchFieldTemplate; context: {searchField: searchField}\"\n            ></ng-container>\n          </div>\n        </ng-container>\n      </div>\n\n      <div class=\"meta-container\" *ngIf=\"expanded$ | async\">\n        <ng-container\n          *ngTemplateOutlet=\"buttonsTemplate; context: {noSearchFields: vars.noSearchFields}\"\n        ></ng-container>\n      </div>\n    </ng-container>\n  </ng-container>\n</ng-template>\n\n<ng-template #searchFieldTemplate let-searchField=\"searchField\">\n  <ng-container\n    *ngIf=\"{\n      values: values$ | async,\n      tooltipKey: 'searchFieldsTooltips.' + searchField.key,\n      tooltip: 'searchFieldsTooltips.' + searchField.key | translate,\n      searchField,\n      title:\n        searchField.title ||\n        ('searchFields.' + searchField.key !== ('searchFields.' + searchField.key | translate)\n          ? ('searchFields.' + searchField.key | translate)\n          : searchField.key),\n    } as vars\"\n  >\n    <ng-container\n      *ngTemplateOutlet=\"\n        searchFieldTemplateText;\n        context: {\n          searchField: searchField,\n          tooltipKey: vars.tooltipKey,\n          tooltip: vars.tooltip,\n          title: vars.title,\n          values: vars.values,\n        }\n      \"\n    ></ng-container>\n    <ng-container\n      *ngTemplateOutlet=\"\n        searchFieldTemplateNumber;\n        context: {\n          searchField: searchField,\n          tooltipKey: vars.tooltipKey,\n          tooltip: vars.tooltip,\n          title: vars.title,\n          values: vars.values,\n        }\n      \"\n    ></ng-container>\n    <ng-container\n      *ngTemplateOutlet=\"\n        searchFieldTemplateDate;\n        context: {\n          searchField: searchField,\n          tooltipKey: vars.tooltipKey,\n          tooltip: vars.tooltip,\n          title: vars.title,\n          values: vars.values,\n        }\n      \"\n    ></ng-container>\n    <ng-container\n      *ngTemplateOutlet=\"\n        searchFieldTemplateBoolean;\n        context: {\n          searchField: searchField,\n          tooltipKey: vars.tooltipKey,\n          tooltip: vars.tooltip,\n          title: vars.title,\n          values: vars.values,\n        }\n      \"\n    ></ng-container>\n    <ng-container\n      *ngTemplateOutlet=\"\n        searchFieldTemplateDateTime;\n        context: {\n          searchField: searchField,\n          tooltipKey: vars.tooltipKey,\n          tooltip: vars.tooltip,\n          title: vars.title,\n          values: vars.values,\n        }\n      \"\n    ></ng-container>\n    <ng-container\n      *ngTemplateOutlet=\"\n        searchFieldTemplateNumberRange;\n        context: {\n          searchField: searchField,\n          tooltipKey: vars.tooltipKey,\n          tooltip: vars.tooltip,\n          title: vars.title,\n          values: vars.values,\n        }\n      \"\n    ></ng-container>\n    <ng-container\n      *ngTemplateOutlet=\"\n        searchFieldTemplateTextRange;\n        context: {\n          searchField: searchField,\n          tooltipKey: vars.tooltipKey,\n          tooltip: vars.tooltip,\n          title: vars.title,\n          values: vars.values,\n        }\n      \"\n    ></ng-container>\n    <ng-container\n      *ngTemplateOutlet=\"\n        searchFieldTemplateDateRange;\n        context: {\n          searchField: searchField,\n          tooltipKey: vars.tooltipKey,\n          tooltip: vars.tooltip,\n          title: vars.title,\n          values: vars.values,\n        }\n      \"\n    ></ng-container>\n    <ng-container\n      *ngTemplateOutlet=\"\n        searchFieldTemplateDateTimeRange;\n        context: {\n          searchField: searchField,\n          tooltipKey: vars.tooltipKey,\n          tooltip: vars.tooltip,\n          title: vars.title,\n          values: vars.values,\n        }\n      \"\n    ></ng-container>\n    <ng-container\n      *ngTemplateOutlet=\"\n        searchFieldTemplateSingleSelectDropdown;\n        context: {\n          searchField: searchField,\n          tooltipKey: vars.tooltipKey,\n          tooltip: vars.tooltip,\n          title: vars.title,\n          values: vars.values,\n        }\n      \"\n    ></ng-container>\n    <ng-container\n      *ngTemplateOutlet=\"\n        searchFieldTemplateMultiSelectDropdown;\n        context: {\n          searchField: searchField,\n          tooltipKey: vars.tooltipKey,\n          tooltip: vars.tooltip,\n          title: vars.title,\n          values: vars.values,\n        }\n      \"\n    ></ng-container>\n  </ng-container>\n</ng-template>\n\n<ng-template\n  #searchFieldTemplateText\n  let-searchField=\"searchField\"\n  let-tooltip=\"tooltip\"\n  let-tooltipKey=\"tooltipKey\"\n  let-title=\"title\"\n  let-values=\"values\"\n>\n  <v-input\n    *ngIf=\"searchField.dataType === 'text' && searchField.fieldType === 'single'\"\n    [dataTestId]=\"'search-field-' + searchField.key\"\n    [name]=\"searchField.key\"\n    [title]=\"title\"\n    [fullWidth]=\"true\"\n    [tooltip]=\"tooltip !== tooltipKey && tooltip\"\n    (valueChange)=\"singleValueChange(searchField.key, $event)\"\n    [smallLabel]=\"true\"\n    [clear$]=\"clear$\"\n    (keyup.enter)=\"search()\"\n    [defaultValue]=\"values[searchField.key]\"\n    [disabled]=\"inputDisabled\"\n  >\n  </v-input>\n</ng-template>\n\n<ng-template\n  #searchFieldTemplateNumber\n  let-searchField=\"searchField\"\n  let-tooltip=\"tooltip\"\n  let-tooltipKey=\"tooltipKey\"\n  let-title=\"title\"\n  let-values=\"values\"\n>\n  <v-input\n    *ngIf=\"searchField.dataType === 'number' && searchField.fieldType === 'single'\"\n    [dataTestId]=\"'search-field-' + searchField.key\"\n    [name]=\"searchField.key\"\n    [title]=\"title\"\n    [fullWidth]=\"true\"\n    (valueChange)=\"singleValueChange(searchField.key, $event)\"\n    type=\"number\"\n    [hideNumberSpinBox]=\"true\"\n    [tooltip]=\"tooltip !== tooltipKey && tooltip\"\n    [smallLabel]=\"true\"\n    [clear$]=\"clear$\"\n    (keyup.enter)=\"search()\"\n    [defaultValue]=\"values[searchField.key]\"\n    [disabled]=\"inputDisabled\"\n  >\n  </v-input>\n</ng-template>\n\n<ng-template\n  #searchFieldTemplateDate\n  let-searchField=\"searchField\"\n  let-tooltip=\"tooltip\"\n  let-tooltipKey=\"tooltipKey\"\n  let-title=\"title\"\n  let-values=\"values\"\n>\n  <v-date-picker\n    *ngIf=\"searchField.dataType === 'date' && searchField.fieldType === 'single'\"\n    [title]=\"title\"\n    [tooltip]=\"tooltip !== tooltipKey && tooltip\"\n    [name]=\"searchField.key\"\n    fullWidth=\"true\"\n    (valueChange)=\"singleValueChange(searchField.key, $event)\"\n    [smallLabel]=\"true\"\n    [clear$]=\"clear$\"\n    (keyup.enter)=\"search()\"\n    [defaultDate]=\"values[searchField.key]\"\n    [disabled]=\"inputDisabled\"\n  ></v-date-picker>\n</ng-template>\n\n<ng-template\n  #searchFieldTemplateTextRange\n  let-searchField=\"searchField\"\n  let-tooltip=\"tooltip\"\n  let-tooltipKey=\"tooltipKey\"\n  let-title=\"title\"\n  let-values=\"values\"\n>\n  <ng-container *ngIf=\"searchField.dataType === 'text' && searchField.fieldType === 'range'\">\n    <v-input-label\n      [title]=\"title\"\n      [tooltip]=\"tooltip !== tooltipKey && tooltip\"\n      [small]=\"true\"\n    ></v-input-label>\n    <v-form\n      (valueChange)=\"multipleValueChange(searchField.key, $event)\"\n      className=\"multiple-search-fields\"\n    >\n      <v-input\n        name=\"start\"\n        [dataTestId]=\"'search-field-' + searchField.key\"\n        [fullWidth]=\"true\"\n        [clear$]=\"clear$\"\n        (keyup.enter)=\"search()\"\n        [defaultValue]=\"values[searchField.key]?.start\"\n        [disabled]=\"inputDisabled\"\n      >\n      </v-input>\n      <ng-container *ngTemplateOutlet=\"toText\"></ng-container>\n      <v-input\n        name=\"end\"\n        [dataTestId]=\"'search-field-' + searchField.key\"\n        [fullWidth]=\"true\"\n        [clear$]=\"clear$\"\n        (keyup.enter)=\"search()\"\n        [defaultValue]=\"values[searchField.key]?.end\"\n        [disabled]=\"inputDisabled\"\n      >\n      </v-input>\n    </v-form>\n  </ng-container>\n</ng-template>\n\n<ng-template\n  #searchFieldTemplateNumberRange\n  let-searchField=\"searchField\"\n  let-tooltip=\"tooltip\"\n  let-tooltipKey=\"tooltipKey\"\n  let-title=\"title\"\n  let-values=\"values\"\n>\n  <ng-container *ngIf=\"searchField.dataType === 'number' && searchField.fieldType === 'range'\">\n    <v-input-label\n      [title]=\"title\"\n      [tooltip]=\"tooltip !== tooltipKey && tooltip\"\n      [small]=\"true\"\n    ></v-input-label>\n    <v-form\n      (valueChange)=\"multipleValueChange(searchField.key, $event)\"\n      className=\"multiple-search-fields\"\n    >\n      <v-input\n        name=\"start\"\n        [dataTestId]=\"'search-field-' + searchField.key\"\n        [fullWidth]=\"true\"\n        type=\"number\"\n        [hideNumberSpinBox]=\"true\"\n        [clear$]=\"clear$\"\n        (keyup.enter)=\"search()\"\n        [defaultValue]=\"values[searchField.key]?.start\"\n        [disabled]=\"inputDisabled\"\n      >\n      </v-input>\n      <ng-container *ngTemplateOutlet=\"toText\"></ng-container>\n      <v-input\n        name=\"end\"\n        [dataTestId]=\"'search-field-' + searchField.key\"\n        [fullWidth]=\"true\"\n        type=\"number\"\n        [hideNumberSpinBox]=\"true\"\n        [clear$]=\"clear$\"\n        (keyup.enter)=\"search()\"\n        [defaultValue]=\"values[searchField.key]?.end\"\n        [disabled]=\"inputDisabled\"\n      >\n      </v-input>\n    </v-form>\n  </ng-container>\n</ng-template>\n\n<ng-template\n  #searchFieldTemplateDateRange\n  let-searchField=\"searchField\"\n  let-tooltip=\"tooltip\"\n  let-tooltipKey=\"tooltipKey\"\n  let-title=\"title\"\n  let-values=\"values\"\n>\n  <ng-container *ngIf=\"searchField.dataType === 'date' && searchField.fieldType === 'range'\">\n    <v-input-label\n      [title]=\"title\"\n      [tooltip]=\"tooltip !== tooltipKey && tooltip\"\n      [small]=\"true\"\n    ></v-input-label>\n    <v-form\n      (valueChange)=\"multipleValueChange(searchField.key, $event)\"\n      className=\"multiple-search-fields\"\n    >\n      <v-date-picker\n        name=\"start\"\n        fullWidth=\"true\"\n        [clear$]=\"clear$\"\n        (keyup.enter)=\"search()\"\n        [defaultDate]=\"values[searchField.key]?.start\"\n        [disabled]=\"inputDisabled\"\n      ></v-date-picker>\n      <ng-container *ngTemplateOutlet=\"toText\"></ng-container>\n      <v-date-picker\n        name=\"end\"\n        fullWidth=\"true\"\n        [clear$]=\"clear$\"\n        (keyup.enter)=\"search()\"\n        [defaultDate]=\"values[searchField.key]?.end\"\n        [disabled]=\"inputDisabled\"\n      ></v-date-picker>\n    </v-form>\n  </ng-container>\n</ng-template>\n\n<ng-template\n  #searchFieldTemplateBoolean\n  let-searchField=\"searchField\"\n  let-tooltip=\"tooltip\"\n  let-tooltipKey=\"tooltipKey\"\n  let-title=\"title\"\n  let-values=\"values\"\n>\n  <ng-container *ngIf=\"searchField.dataType === 'boolean'\">\n    <v-input-label\n      [title]=\"title\"\n      [tooltip]=\"tooltip !== tooltipKey && tooltip\"\n      [small]=\"true\"\n    ></v-input-label>\n    <v-select\n      *ngIf=\"booleanItems$ | async as booleanItems\"\n      [items]=\"booleanItems\"\n      [margin]=\"false\"\n      [required]=\"false\"\n      [name]=\"searchField.key\"\n      [clearSelectionSubject$]=\"clear$\"\n      (selectedChange)=\"singleValueChange(searchField.key, $event)\"\n      (keyup.enter)=\"search()\"\n      [defaultSelectionId]=\"getDefaultBooleanSelectionId(values, searchField.key)\"\n      [disabled]=\"inputDisabled\"\n      [appendInline]=\"false\"\n    ></v-select>\n  </ng-container>\n</ng-template>\n\n<ng-template\n  #searchFieldTemplateDateTime\n  let-searchField=\"searchField\"\n  let-tooltip=\"tooltip\"\n  let-tooltipKey=\"tooltipKey\"\n  let-title=\"title\"\n  let-values=\"values\"\n>\n  <v-date-picker\n    *ngIf=\"searchField.dataType === 'datetime' && searchField.fieldType === 'single'\"\n    [title]=\"title\"\n    [tooltip]=\"tooltip !== tooltipKey && tooltip\"\n    [name]=\"searchField.key\"\n    fullWidth=\"true\"\n    (valueChange)=\"singleValueChange(searchField.key, $event, true)\"\n    [smallLabel]=\"true\"\n    [enableTime]=\"true\"\n    [clear$]=\"clear$\"\n    (keyup.enter)=\"search()\"\n    [defaultDate]=\"values[searchField.key]\"\n    [disabled]=\"inputDisabled\"\n  ></v-date-picker>\n</ng-template>\n\n<ng-template\n  #searchFieldTemplateDateTimeRange\n  let-searchField=\"searchField\"\n  let-tooltip=\"tooltip\"\n  let-tooltipKey=\"tooltipKey\"\n  let-title=\"title\"\n  let-values=\"values\"\n>\n  <ng-container *ngIf=\"searchField.dataType === 'datetime' && searchField.fieldType === 'range'\">\n    <v-input-label\n      [title]=\"title\"\n      [tooltip]=\"tooltip !== tooltipKey && tooltip\"\n      [small]=\"true\"\n    ></v-input-label>\n    <v-form\n      (valueChange)=\"multipleValueChange(searchField.key, $event, true)\"\n      className=\"multiple-search-fields\"\n    >\n      <v-date-picker\n        name=\"start\"\n        fullWidth=\"true\"\n        [enableTime]=\"true\"\n        [clear$]=\"clear$\"\n        (keyup.enter)=\"search()\"\n        [defaultDate]=\"values[searchField.key]?.start\"\n        [disabled]=\"inputDisabled\"\n      ></v-date-picker>\n      <ng-container *ngTemplateOutlet=\"toText\"></ng-container>\n      <v-date-picker\n        name=\"end\"\n        fullWidth=\"true\"\n        [enableTime]=\"true\"\n        [clear$]=\"clear$\"\n        (keyup.enter)=\"search()\"\n        [defaultDate]=\"values[searchField.key]?.end\"\n        [disabled]=\"inputDisabled\"\n      ></v-date-picker>\n    </v-form>\n  </ng-container>\n</ng-template>\n\n<ng-template\n  #searchFieldTemplateSingleSelectDropdown\n  let-searchField=\"searchField\"\n  let-tooltip=\"tooltip\"\n  let-tooltipKey=\"tooltipKey\"\n  let-title=\"title\"\n  let-values=\"values\"\n>\n  <ng-container\n    *ngIf=\"\n      searchField.dataType === 'text' &&\n      (searchField.fieldType === 'single-select-dropdown' ||\n        searchField.fieldType === 'single_select_dropdown')\n    \"\n  >\n    <v-input-label\n      [title]=\"title\"\n      [tooltip]=\"tooltip !== tooltipKey && tooltip\"\n      [small]=\"true\"\n    ></v-input-label>\n    <v-select\n      *ngIf=\"dropdownSelectItemsMap[searchField.key] as searchFieldSelectItems\"\n      [items]=\"searchFieldSelectItems\"\n      [margin]=\"false\"\n      [required]=\"false\"\n      [name]=\"searchField.key\"\n      [clearSelectionSubject$]=\"clear$\"\n      (selectedChange)=\"singleValueChange(searchField.key, $event)\"\n      (keyup.enter)=\"search()\"\n      [defaultSelectionId]=\"values[searchField.key]\"\n      [disabled]=\"inputDisabled\"\n      [appendInline]=\"false\"\n    ></v-select>\n  </ng-container>\n</ng-template>\n\n<ng-template\n  #searchFieldTemplateMultiSelectDropdown\n  let-searchField=\"searchField\"\n  let-tooltip=\"tooltip\"\n  let-tooltipKey=\"tooltipKey\"\n  let-title=\"title\"\n  let-values=\"values\"\n>\n  <ng-container\n    *ngIf=\"\n      searchField.dataType === 'text' &&\n      (searchField.fieldType === 'multi-select-dropdown' ||\n        searchField.fieldType === 'multi_select_dropdown')\n    \"\n  >\n    <v-input-label\n      [title]=\"title\"\n      [tooltip]=\"tooltip !== tooltipKey && tooltip\"\n      [small]=\"true\"\n    ></v-input-label>\n    <v-select\n      *ngIf=\"dropdownSelectItemsMap[searchField.key] as searchFieldSelectItems\"\n      [items]=\"searchFieldSelectItems\"\n      [margin]=\"false\"\n      [multiple]=\"true\"\n      [required]=\"false\"\n      [name]=\"searchField.key\"\n      [clearSelectionSubject$]=\"clear$\"\n      (selectedChange)=\"multipleValueChange(searchField.key, $event)\"\n      (keyup.enter)=\"search()\"\n      [defaultSelectionIds]=\"values[searchField.key]\"\n      [disabled]=\"inputDisabled\"\n      [appendInline]=\"false\"\n    ></v-select>\n  </ng-container>\n</ng-template>\n\n<ng-template #toText>\n  <div class=\"to-text\">\n    <v-paragraph>{{ 'searchFields.to' | translate }}</v-paragraph>\n  </div>\n</ng-template>\n\n<ng-template #buttonsTemplate let-noSearchFields=\"noSearchFields\">\n  <ng-container\n    *ngTemplateOutlet=\"noSearchFieldsTemplate; context: {noSearchFields: noSearchFields}\"\n  ></ng-container>\n\n  <div\n    class=\"buttons-container\"\n    *ngIf=\"\n      !noSearchFields && {expanded: expanded$ | async, isSearchEmpty: isSearchEmpty$ | async} as obs\n    \"\n  >\n    <div class=\"right-buttons\">\n      <button\n        *ngIf=\"obs.expanded\"\n        cdsButton=\"tertiary\"\n        data-testid=\"search-fields-clear-button\"\n        (click)=\"clear()\"\n        [disabled]=\"loading || noSearchFields || inputDisabled\"\n        type=\"button\"\n        id=\"clear\"\n      >\n        <svg cdsIcon=\"trash-can\" size=\"16\" class=\"cds--btn__icon\"></svg>\n\n        {{ 'searchFields.clearButtonText' | translate }}\n      </button>\n\n      <button\n        *ngIf=\"obs.expanded && canSaveSearch\"\n        cdsButton=\"secondary\"\n        data-testid=\"search-fields-save-button\"\n        [disabled]=\"disableSaveSearch && obs.isSearchEmpty\"\n        (click)=\"saveSearch()\"\n        type=\"button\"\n        id=\"save\"\n      >\n        <svg cdsIcon=\"save\" size=\"16\" class=\"cds--btn__icon\"></svg>\n\n        {{ 'searchFields.saveButtonText' | translate }}\n      </button>\n\n      <button\n        *ngIf=\"obs.expanded\"\n        cdsButton=\"primary\"\n        data-testid=\"search-fields-search-button\"\n        (click)=\"search()\"\n        [disabled]=\"\n          loading || noSearchFields || (hasValidValues$ | async) === false || inputDisabled\n        \"\n        type=\"button\"\n        id=\"search\"\n      >\n        <svg cdsIcon=\"search\" size=\"16\" class=\"cds--btn__icon\"></svg>\n\n        {{ 'searchFields.searchButtonText' | translate }}\n      </button>\n    </div>\n  </div>\n</ng-template>\n\n<ng-template #noSearchFieldsTemplate let-noSearchFields=\"noSearchFields\">\n  <div class=\"no-search-fields-message\" *ngIf=\"noSearchFields\">\n    <v-paragraph dataTestId=\"search-fields-no-fields\" [fullWidth]=\"true\" [center]=\"true\">{{\n      'searchFields.noneConfigured' | translate\n    }}</v-paragraph>\n  </div>\n</ng-template>\n", styles: ["::ng-deep .multiple-search-fields{display:flex!important;flex-direction:row!important;align-items:center}.to-text{margin-inline-start:8px;margin-inline-end:8px}.buttons-container{width:100%;display:flex;justify-content:flex-end}.right-buttons{display:flex;flex-direction:row;gap:16px}.search-fields-container{padding-bottom:16px;padding-top:16px;display:grid;gap:16px;grid-template-columns:repeat(3,1fr)}.search-fields-container--hidden{display:none}.meta-container{width:100%;padding-bottom:16px}.loading-container{display:flex;width:100%;justify-content:center}.no-search-fields-message{display:flex;width:100%;justify-content:center;margin-top:16px}.search-fields-tile{padding:0}::ng-deep .cds--accordion{background-color:var(--cds-layer)}::ng-deep .cds--accordion__item{border-inline-start:1px solid var(--cds-border-subtle);border-inline-end:1px solid var(--cds-border-subtle)}::ng-deep .cds--accordion__content{padding:0 16px}\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: i3$1.DocumentService }, { type: i1.TranslateService }, { type: i2$2.IconService }], propDecorators: { loading: [{
+        }], ctorParameters: () => [{ type: i3$1.DocumentService }, { type: i1.TranslateService }, { type: i2$3.IconService }], propDecorators: { loading: [{
                 type: Input
             }], searchFields: [{
                 type: Input
@@ -14373,7 +14546,7 @@ class DateTimePickerComponent {
         return date.toLocaleDateString('nl-NL');
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.20", ngImport: i0, type: DateTimePickerComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.20", type: DateTimePickerComponent, isStandalone: true, selector: "valtimo-date-time-picker", inputs: { fullWidth: "fullWidth", margin: "margin", name: "name", title: "title", placeholder: "placeholder", titleTranslationKey: "titleTranslationKey", disabled: "disabled", tooltip: "tooltip", required: "required", smallLabel: "smallLabel", enableTime: "enableTime", carbonTheme: "carbonTheme", dateFormat: "dateFormat", showFieldLabel: "showFieldLabel", datePlaceholder: "datePlaceholder", timePlaceholder: "timePlaceholder", labelText: "labelText", defaultDate: "defaultDate", defaultDateIsToday: "defaultDateIsToday", clear$: "clear$" }, outputs: { valueChange: "valueChange" }, host: { properties: { "class.valtimo-date-time-picker": "this.hostClass", "class.full-width": "this.fullWidth", "class.margin": "this.margin" } }, 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<v-input-label\n  *ngIf=\"showFieldLabel && (title || titleTranslationKey)\"\n  [name]=\"name\"\n  [required]=\"required\"\n  [small]=\"smallLabel\"\n  [titleTranslationKey]=\"titleTranslationKey\"\n  [title]=\"title\"\n  [tooltip]=\"tooltip\"\n>\n</v-input-label>\n\n<div class=\"valtimo-date-time-picker__wrapper\">\n  <cds-date-picker\n    class=\"date-only\"\n    [cdsLayer]=\"1\"\n    [attr.data-carbon-theme]=\"carbonTheme\"\n    [label]=\"labelText\"\n    [placeholder]=\"datePlaceholder || 'dd-mm-yyyy'\"\n    [dateFormat]=\"dateFormat\"\n    [disabled]=\"disabled\"\n    [ngModel]=\"dateValue$ | async\"\n    (ngModelChange)=\"onDateSelected($event)\"\n  ></cds-date-picker>\n\n  <cds-timepicker\n    *ngIf=\"enableTime\"\n    [cdsLayer]=\"1\"\n    [attr.data-carbon-theme]=\"carbonTheme\"\n    [placeholder]=\"timePlaceholder || 'hh:mm'\"\n    [disabled]=\"disabled\"\n    [ngModel]=\"timeValue$ | async\"\n    (ngModelChange)=\"onTimeSelected($event)\"\n  ></cds-timepicker>\n</div>\n", styles: [".valtimo-date-time-picker{display:flex;flex-direction:column;gap:8px}.valtimo-date-time-picker.full-width{width:100%}.valtimo-date-time-picker.margin{margin-bottom:16px}.valtimo-date-time-picker__wrapper{display:flex;align-items:flex-end;gap:16px}.valtimo-date-time-picker ::ng-deep .cds--date-picker.cds--date-picker--single .cds--date-picker__input{inline-size:unset!important}.valtimo-date-time-picker ::ng-deep .cds--date-picker__input,.valtimo-date-time-picker ::ng-deep .cds--time-picker__input-field{background-color:var(--cds-field-01)!important}\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: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$4.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "pipe", type: i1$4.AsyncPipe, name: "async" }, { 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: FormsModule }, { kind: "directive", type: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "ngmodule", type: TranslateModule }, { kind: "ngmodule", type: InputModule$1 }, { kind: "ngmodule", type: DatePickerModule$1 }, { kind: "component", type: i2$2.DatePicker, selector: "cds-date-picker, ibm-date-picker", inputs: ["range", "dateFormat", "language", "label", "helperText", "rangeHelperText", "rangeLabel", "placeholder", "ariaLabel", "inputPattern", "id", "value", "theme", "disabled", "readonly", "invalid", "invalidText", "warn", "warnText", "size", "rangeInvalid", "rangeInvalidText", "rangeWarn", "rangeWarnText", "skeleton", "plugins", "flatpickrOptions"], outputs: ["valueChange", "onClose"] }, { kind: "ngmodule", type: TimePickerModule }, { kind: "component", type: i2$2.TimePicker, selector: "cds-timepicker, ibm-timepicker", inputs: ["invalid", "invalidText", "label", "hideLabel", "placeholder", "pattern", "id", "disabled", "value", "maxLength", "skeleton", "theme", "size"], outputs: ["valueChange"] }, { kind: "ngmodule", type: LayerModule }, { kind: "directive", type: i2$2.LayerDirective, selector: "[cdsLayer], [ibmLayer]", inputs: ["ibmLayer", "cdsLayer"], exportAs: ["layer"] }] }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.20", type: DateTimePickerComponent, isStandalone: true, selector: "valtimo-date-time-picker", inputs: { fullWidth: "fullWidth", margin: "margin", name: "name", title: "title", placeholder: "placeholder", titleTranslationKey: "titleTranslationKey", disabled: "disabled", tooltip: "tooltip", required: "required", smallLabel: "smallLabel", enableTime: "enableTime", carbonTheme: "carbonTheme", dateFormat: "dateFormat", showFieldLabel: "showFieldLabel", datePlaceholder: "datePlaceholder", timePlaceholder: "timePlaceholder", labelText: "labelText", defaultDate: "defaultDate", defaultDateIsToday: "defaultDateIsToday", clear$: "clear$" }, outputs: { valueChange: "valueChange" }, host: { properties: { "class.valtimo-date-time-picker": "this.hostClass", "class.full-width": "this.fullWidth", "class.margin": "this.margin" } }, 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<v-input-label\n  *ngIf=\"showFieldLabel && (title || titleTranslationKey)\"\n  [name]=\"name\"\n  [required]=\"required\"\n  [small]=\"smallLabel\"\n  [titleTranslationKey]=\"titleTranslationKey\"\n  [title]=\"title\"\n  [tooltip]=\"tooltip\"\n>\n</v-input-label>\n\n<div class=\"valtimo-date-time-picker__wrapper\">\n  <cds-date-picker\n    class=\"date-only\"\n    [cdsLayer]=\"1\"\n    [attr.data-carbon-theme]=\"carbonTheme\"\n    [label]=\"labelText\"\n    [placeholder]=\"datePlaceholder || 'dd-mm-yyyy'\"\n    [dateFormat]=\"dateFormat\"\n    [disabled]=\"disabled\"\n    [ngModel]=\"dateValue$ | async\"\n    (ngModelChange)=\"onDateSelected($event)\"\n  ></cds-date-picker>\n\n  <cds-timepicker\n    *ngIf=\"enableTime\"\n    [cdsLayer]=\"1\"\n    [attr.data-carbon-theme]=\"carbonTheme\"\n    [placeholder]=\"timePlaceholder || 'hh:mm'\"\n    [disabled]=\"disabled\"\n    [ngModel]=\"timeValue$ | async\"\n    (ngModelChange)=\"onTimeSelected($event)\"\n  ></cds-timepicker>\n</div>\n", styles: [".valtimo-date-time-picker{display:flex;flex-direction:column;gap:8px}.valtimo-date-time-picker.full-width{width:100%}.valtimo-date-time-picker.margin{margin-bottom:16px}.valtimo-date-time-picker__wrapper{display:flex;align-items:flex-end;gap:16px}.valtimo-date-time-picker ::ng-deep .cds--date-picker.cds--date-picker--single .cds--date-picker__input{inline-size:unset!important}.valtimo-date-time-picker ::ng-deep .cds--date-picker__input,.valtimo-date-time-picker ::ng-deep .cds--time-picker__input-field{background-color:var(--cds-field-01)!important}\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: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$4.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "pipe", type: i1$4.AsyncPipe, name: "async" }, { 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: FormsModule }, { kind: "directive", type: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "ngmodule", type: TranslateModule }, { kind: "ngmodule", type: InputModule$1 }, { kind: "ngmodule", type: DatePickerModule$1 }, { kind: "component", type: i2$3.DatePicker, selector: "cds-date-picker, ibm-date-picker", inputs: ["range", "dateFormat", "language", "label", "helperText", "rangeHelperText", "rangeLabel", "placeholder", "ariaLabel", "inputPattern", "id", "value", "theme", "disabled", "readonly", "invalid", "invalidText", "warn", "warnText", "size", "rangeInvalid", "rangeInvalidText", "rangeWarn", "rangeWarnText", "skeleton", "plugins", "flatpickrOptions"], outputs: ["valueChange", "onClose"] }, { kind: "ngmodule", type: TimePickerModule }, { kind: "component", type: i2$3.TimePicker, selector: "cds-timepicker, ibm-timepicker", inputs: ["invalid", "invalidText", "label", "hideLabel", "placeholder", "pattern", "id", "disabled", "value", "maxLength", "skeleton", "theme", "size"], outputs: ["valueChange"] }, { kind: "ngmodule", type: LayerModule }, { kind: "directive", type: i2$3.LayerDirective, selector: "[cdsLayer], [ibmLayer]", inputs: ["ibmLayer", "cdsLayer"], exportAs: ["layer"] }] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.20", ngImport: i0, type: DateTimePickerComponent, decorators: [{
             type: Component,
@@ -14704,7 +14877,7 @@ class ConfirmationModalComponent {
         this.optionalEvent.emit(this.outputOnOptional);
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.20", ngImport: i0, type: ConfirmationModalComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.20", type: ConfirmationModalComponent, isStandalone: false, selector: "valtimo-confirmation-modal", inputs: { titleTranslationKey: "titleTranslationKey", title: "title", content: "content", contentTranslationKey: "contentTranslationKey", confirmButtonText: "confirmButtonText", confirmButtonTextTranslationKey: "confirmButtonTextTranslationKey", confirmButtonType: "confirmButtonType", showOptionalButton: "showOptionalButton", optionalButtonText: "optionalButtonText", optionalButtonTextTranslationKey: "optionalButtonTextTranslationKey", optionalButtonType: "optionalButtonType", cancelButtonText: "cancelButtonText", cancelButtonTextTranslationKey: "cancelButtonTextTranslationKey", cancelButtonType: "cancelButtonType", showModalSubject$: "showModalSubject$", outputOnConfirm: "outputOnConfirm", outputOnOptional: "outputOnOptional", spacerAfterCancelButton: "spacerAfterCancelButton" }, outputs: { confirmEvent: "confirmEvent", optionalEvent: "optionalEvent", cancelEvent: "cancelEvent" }, 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-modal\n  valtimoCdsModal\n  [open]=\"modalOpen$ | async\"\n  *ngIf=\"{\n    deleteTranslation: 'interface.delete' | translate,\n    deleteConfirmationTranslation: 'interface.deleteConfirmation' | translate,\n    cancelTranslation: 'interface.cancel' | translate,\n    titleTranslation: titleTranslationKey | translate,\n    contentTranslation: contentTranslationKey | translate,\n    confirmButtonTranslation: confirmButtonTextTranslationKey | translate,\n    cancelButtonTranslation: cancelButtonTextTranslationKey | translate,\n    optionalButtonTranslation: optionalButtonTextTranslationKey | translate,\n  } as obs\"\n  (close)=\"closeModal()\"\n>\n  <cds-modal-header [showCloseButton]=\"true\" (closeSelect)=\"closeModal()\">\n    <h3 cdsModalHeaderHeading>\n      {{\n        (titleTranslationKey !== obs.titleTranslation ? obs.titleTranslation : '') ||\n          title ||\n          obs.deleteTranslation\n      }}\n    </h3>\n  </cds-modal-header>\n\n  <section cdsModalContent>\n    {{\n      (contentTranslationKey !== obs.contentTranslation ? obs.contentTranslation : '') ||\n        content ||\n        obs.deleteConfirmationTranslation\n    }}\n\n    <div class=\"modal-body-content\">\n      <ng-content></ng-content>\n    </div>\n  </section>\n\n  <cds-modal-footer>\n    <ng-container>\n      <button\n        [attr.data-test-id]=\"testIds.closeButton\"\n        [attr.modal-primary-focus]=\"true\"\n        [cdsButton]=\"cancelButtonType\"\n        (click)=\"closeModal()\"\n      >\n        {{\n          (cancelButtonTextTranslationKey !== obs.cancelButtonTranslation\n            ? obs.cancelButtonTranslation\n            : '') ||\n            cancelButtonText ||\n            obs.cancelTranslation\n        }}\n      </button>\n      <div *ngIf=\"spacerAfterCancelButton\" class=\"modal-spacer\"></div>\n      <button\n        *ngIf=\"showOptionalButton\"\n        [attr.data-test-id]=\"testIds.optionalButton\"\n        [attr.modal-primary-focus]=\"true\"\n        [cdsButton]=\"optionalButtonType\"\n        (click)=\"onOptional()\"\n      >\n        {{\n          (optionalButtonTextTranslationKey !== obs.optionalButtonTranslation\n            ? obs.optionalButtonTranslation\n            : '') ||\n            optionalButtonText ||\n            obs.deleteTranslation\n        }}\n      </button>\n      <button\n        [attr.data-test-id]=\"testIds.confirmButton\"\n        [attr.modal-primary-focus]=\"true\"\n        [cdsButton]=\"confirmButtonType\"\n        (click)=\"onConfirm()\"\n      >\n        {{\n          (confirmButtonTextTranslationKey !== obs.confirmButtonTranslation\n            ? obs.confirmButtonTranslation\n            : '') ||\n            confirmButtonText ||\n            obs.deleteTranslation\n        }}\n      </button>\n    </ng-container>\n  </cds-modal-footer>\n</cds-modal>\n", styles: [".modal-spacer{flex:0 1 50%}.modal-body-content{margin-top:16px}\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.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i2$2.Modal, selector: "cds-modal, ibm-modal", inputs: ["size", "theme", "ariaLabel", "open", "trigger", "hasScrollingContent"], outputs: ["overlaySelected", "close"] }, { kind: "component", type: i2$2.ModalHeader, selector: "cds-modal-header, ibm-modal-header", inputs: ["theme", "closeLabel", "showCloseButton"], outputs: ["closeSelect"] }, { kind: "component", type: i2$2.ModalFooter, selector: "cds-modal-footer, ibm-modal-footer" }, { kind: "directive", type: i2$2.ModalContent, selector: "[cdsModalContent], [ibmModalContent]", inputs: ["hasForm"] }, { kind: "directive", type: i2$2.ModalHeaderHeading, selector: "[cdsModalHeaderHeading], [ibmModalHeaderHeading]" }, { kind: "directive", type: i2$2.Button, selector: "[cdsButton], [ibmButton]", inputs: ["ibmButton", "cdsButton", "size", "skeleton", "iconOnly", "isExpressive"] }, { kind: "directive", type: ValtimoCdsModalDirective, selector: "[valtimoCdsModal]", inputs: ["minContentHeight"] }, { kind: "pipe", type: i1$4.AsyncPipe, name: "async" }, { kind: "pipe", type: i1.TranslatePipe, name: "translate" }] }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.20", type: ConfirmationModalComponent, isStandalone: false, selector: "valtimo-confirmation-modal", inputs: { titleTranslationKey: "titleTranslationKey", title: "title", content: "content", contentTranslationKey: "contentTranslationKey", confirmButtonText: "confirmButtonText", confirmButtonTextTranslationKey: "confirmButtonTextTranslationKey", confirmButtonType: "confirmButtonType", showOptionalButton: "showOptionalButton", optionalButtonText: "optionalButtonText", optionalButtonTextTranslationKey: "optionalButtonTextTranslationKey", optionalButtonType: "optionalButtonType", cancelButtonText: "cancelButtonText", cancelButtonTextTranslationKey: "cancelButtonTextTranslationKey", cancelButtonType: "cancelButtonType", showModalSubject$: "showModalSubject$", outputOnConfirm: "outputOnConfirm", outputOnOptional: "outputOnOptional", spacerAfterCancelButton: "spacerAfterCancelButton" }, outputs: { confirmEvent: "confirmEvent", optionalEvent: "optionalEvent", cancelEvent: "cancelEvent" }, 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-modal\n  valtimoCdsModal\n  [open]=\"modalOpen$ | async\"\n  *ngIf=\"{\n    deleteTranslation: 'interface.delete' | translate,\n    deleteConfirmationTranslation: 'interface.deleteConfirmation' | translate,\n    cancelTranslation: 'interface.cancel' | translate,\n    titleTranslation: titleTranslationKey | translate,\n    contentTranslation: contentTranslationKey | translate,\n    confirmButtonTranslation: confirmButtonTextTranslationKey | translate,\n    cancelButtonTranslation: cancelButtonTextTranslationKey | translate,\n    optionalButtonTranslation: optionalButtonTextTranslationKey | translate,\n  } as obs\"\n  (close)=\"closeModal()\"\n>\n  <cds-modal-header [showCloseButton]=\"true\" (closeSelect)=\"closeModal()\">\n    <h3 cdsModalHeaderHeading>\n      {{\n        (titleTranslationKey !== obs.titleTranslation ? obs.titleTranslation : '') ||\n          title ||\n          obs.deleteTranslation\n      }}\n    </h3>\n  </cds-modal-header>\n\n  <section cdsModalContent>\n    {{\n      (contentTranslationKey !== obs.contentTranslation ? obs.contentTranslation : '') ||\n        content ||\n        obs.deleteConfirmationTranslation\n    }}\n\n    <div class=\"modal-body-content\">\n      <ng-content></ng-content>\n    </div>\n  </section>\n\n  <cds-modal-footer>\n    <ng-container>\n      <button\n        [attr.data-test-id]=\"testIds.closeButton\"\n        [attr.modal-primary-focus]=\"true\"\n        [cdsButton]=\"cancelButtonType\"\n        (click)=\"closeModal()\"\n      >\n        {{\n          (cancelButtonTextTranslationKey !== obs.cancelButtonTranslation\n            ? obs.cancelButtonTranslation\n            : '') ||\n            cancelButtonText ||\n            obs.cancelTranslation\n        }}\n      </button>\n      <div *ngIf=\"spacerAfterCancelButton\" class=\"modal-spacer\"></div>\n      <button\n        *ngIf=\"showOptionalButton\"\n        [attr.data-test-id]=\"testIds.optionalButton\"\n        [attr.modal-primary-focus]=\"true\"\n        [cdsButton]=\"optionalButtonType\"\n        (click)=\"onOptional()\"\n      >\n        {{\n          (optionalButtonTextTranslationKey !== obs.optionalButtonTranslation\n            ? obs.optionalButtonTranslation\n            : '') ||\n            optionalButtonText ||\n            obs.deleteTranslation\n        }}\n      </button>\n      <button\n        [attr.data-test-id]=\"testIds.confirmButton\"\n        [attr.modal-primary-focus]=\"true\"\n        [cdsButton]=\"confirmButtonType\"\n        (click)=\"onConfirm()\"\n      >\n        {{\n          (confirmButtonTextTranslationKey !== obs.confirmButtonTranslation\n            ? obs.confirmButtonTranslation\n            : '') ||\n            confirmButtonText ||\n            obs.deleteTranslation\n        }}\n      </button>\n    </ng-container>\n  </cds-modal-footer>\n</cds-modal>\n", styles: [".modal-spacer{flex:0 1 50%}.modal-body-content{margin-top:16px}\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.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i2$3.Modal, selector: "cds-modal, ibm-modal", inputs: ["size", "theme", "ariaLabel", "open", "trigger", "hasScrollingContent"], outputs: ["overlaySelected", "close"] }, { kind: "component", type: i2$3.ModalHeader, selector: "cds-modal-header, ibm-modal-header", inputs: ["theme", "closeLabel", "showCloseButton"], outputs: ["closeSelect"] }, { kind: "component", type: i2$3.ModalFooter, selector: "cds-modal-footer, ibm-modal-footer" }, { kind: "directive", type: i2$3.ModalContent, selector: "[cdsModalContent], [ibmModalContent]", inputs: ["hasForm"] }, { kind: "directive", type: i2$3.ModalHeaderHeading, selector: "[cdsModalHeaderHeading], [ibmModalHeaderHeading]" }, { kind: "directive", type: i2$3.Button, selector: "[cdsButton], [ibmButton]", inputs: ["ibmButton", "cdsButton", "size", "skeleton", "iconOnly", "isExpressive"] }, { kind: "directive", type: ValtimoCdsModalDirective, selector: "[valtimoCdsModal]", inputs: ["minContentHeight"] }, { kind: "pipe", type: i1$4.AsyncPipe, name: "async" }, { kind: "pipe", type: i1.TranslatePipe, name: "translate" }] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.20", ngImport: i0, type: ConfirmationModalComponent, decorators: [{
             type: Component,
@@ -14806,7 +14979,7 @@ class ExpansionPanelComponent {
         this.open$.next(!this.open$.value);
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.20", ngImport: i0, type: ExpansionPanelComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.20", type: ExpansionPanelComponent, isStandalone: false, selector: "valtimo-expansion-panel-component", inputs: { hideAboveFoldWhenExpanded: "hideAboveFoldWhenExpanded" }, host: { listeners: { "click": "clickInside()" } }, 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-expandable-tile>\n  <div\n    [hidden]=\"hideAboveFoldWhenExpanded && (open$ | async) === true\"\n    class=\"cds--tile-content__above-the-fold above-fold\"\n  >\n    <ng-content select=\"[collapsed]\"></ng-content>\n  </div>\n  <div class=\"cds--tile-content__below-the-fold below-fold\">\n    <ng-content select=\"[expanded]\"></ng-content>\n  </div>\n</cds-expandable-tile>\n", styles: ["/*!\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: "component", type: i2$2.ExpandableTile, selector: "cds-expandable-tile, ibm-expandable-tile", inputs: ["theme", "expanded", "interactive", "translations"] }, { kind: "pipe", type: i1$4.AsyncPipe, name: "async" }] }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.20", type: ExpansionPanelComponent, isStandalone: false, selector: "valtimo-expansion-panel-component", inputs: { hideAboveFoldWhenExpanded: "hideAboveFoldWhenExpanded" }, host: { listeners: { "click": "clickInside()" } }, 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-expandable-tile>\n  <div\n    [hidden]=\"hideAboveFoldWhenExpanded && (open$ | async) === true\"\n    class=\"cds--tile-content__above-the-fold above-fold\"\n  >\n    <ng-content select=\"[collapsed]\"></ng-content>\n  </div>\n  <div class=\"cds--tile-content__below-the-fold below-fold\">\n    <ng-content select=\"[expanded]\"></ng-content>\n  </div>\n</cds-expandable-tile>\n", styles: ["/*!\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: "component", type: i2$3.ExpandableTile, selector: "cds-expandable-tile, ibm-expandable-tile", inputs: ["theme", "expanded", "interactive", "translations"] }, { kind: "pipe", type: i1$4.AsyncPipe, name: "async" }] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.20", ngImport: i0, type: ExpansionPanelComponent, decorators: [{
             type: Component,
@@ -15293,7 +15466,7 @@ class StatusSelectorComponent {
         });
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.20", ngImport: i0, type: StatusSelectorComponent, deps: [{ token: i1.TranslateService }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.20", type: StatusSelectorComponent, isStandalone: true, selector: "valtimo-status-selector", inputs: { statuses: "statuses", selectedStatusKeys: "selectedStatusKeys", carbonTheme: "carbonTheme", disabled: "disabled" }, outputs: { selectedStatusesChangeEvent: "selectedStatusesChangeEvent" }, 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-label class=\"status-selector\" *ngIf=\"listItems$ | async as listItems\">\n  {{ 'caseManagement.statuses.searchFieldTitle' | translate }}\n\n  <cds-dropdown\n    [appendInline]=\"false\"\n    type=\"multi\"\n    [disabled]=\"disabled\"\n    selectionFeedback=\"fixed\"\n    (selected)=\"itemSelected($event)\"\n  >\n    <cds-dropdown-list\n      [items]=\"listItems\"\n      [listTpl]=\"colorDropdownItemTemplate\"\n    ></cds-dropdown-list>\n  </cds-dropdown>\n</cds-label>\n\n<ng-template #colorDropdownItemTemplate let-item=\"item\">\n  <div class=\"status-selector-dropdown-template\">\n    <cds-checkbox [checked]=\"item.selected\"></cds-checkbox>\n\n    <span *ngIf=\"item.key === CASES_WITHOUT_STATUS_KEY\" class=\"generic-span\">{{\n      item?.content\n    }}</span>\n\n    <cds-tag\n      *ngIf=\"item.key !== CASES_WITHOUT_STATUS_KEY\"\n      class=\"cds-tag--no-margin\"\n      [type]=\"item?.tagType\"\n      [title]=\"item?.content\"\n    >\n      {{ item?.content }}\n    </cds-tag>\n  </div>\n</ng-template>\n", styles: ["::ng-deep .status-selector .cds--label{width:100%;margin-bottom:0!important}::ng-deep .status-selector .cds--multiselect{margin-top:8px}::ng-deep .status-selector .cds--list-box__selection--multi{pointer-events:none}::ng-deep .status-selector .cds--list-box__selection--multi svg{pointer-events:auto}::ng-deep .status-selector-dropdown-template{display:flex;margin-top:-4px}::ng-deep .status-selector-dropdown-template .cds--tag{margin:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;display:inline-block;line-height:24px;max-width:100%}::ng-deep .status-selector-dropdown-template .generic-span{display:flex;align-items: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: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$4.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "pipe", type: i1$4.AsyncPipe, name: "async" }, { kind: "ngmodule", type: DropdownModule }, { kind: "component", type: i2$2.Dropdown, selector: "cds-dropdown, ibm-dropdown", inputs: ["id", "label", "hideLabel", "helperText", "placeholder", "displayValue", "clearText", "size", "type", "theme", "disabled", "readonly", "skeleton", "inline", "disableArrowKeys", "invalid", "invalidText", "warn", "warnText", "appendInline", "scrollableContainer", "itemValueKey", "selectionFeedback", "menuButtonLabel", "selectedLabel", "dropUp", "fluid"], outputs: ["selected", "onClose", "close"] }, { kind: "component", type: i2$2.DropdownList, selector: "cds-dropdown-list, ibm-dropdown-list", inputs: ["ariaLabel", "items", "listTpl", "type", "showTitles"], outputs: ["select", "scroll", "blurIntent"] }, { kind: "ngmodule", type: CheckboxModule }, { kind: "component", type: i2$2.Checkbox, selector: "cds-checkbox, ibm-checkbox", inputs: ["disabled", "skeleton", "hideLabel", "name", "id", "required", "value", "ariaLabel", "ariaLabelledby", "indeterminate", "checked"], outputs: ["click", "checkedChange", "indeterminateChange"] }, { kind: "ngmodule", type: InputModule$1 }, { kind: "component", type: i2$2.Label, selector: "cds-label, ibm-label", inputs: ["labelInputID", "disabled", "skeleton", "helperText", "invalidText", "invalid", "warn", "warnText", "ariaLabel"] }, { kind: "ngmodule", type: TranslateModule }, { kind: "pipe", type: i1.TranslatePipe, name: "translate" }, { kind: "ngmodule", type: TagModule }, { kind: "component", type: i2$2.Tag, selector: "cds-tag, ibm-tag", inputs: ["type", "size", "class", "skeleton"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.20", type: StatusSelectorComponent, isStandalone: true, selector: "valtimo-status-selector", inputs: { statuses: "statuses", selectedStatusKeys: "selectedStatusKeys", carbonTheme: "carbonTheme", disabled: "disabled" }, outputs: { selectedStatusesChangeEvent: "selectedStatusesChangeEvent" }, 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-label class=\"status-selector\" *ngIf=\"listItems$ | async as listItems\">\n  {{ 'caseManagement.statuses.searchFieldTitle' | translate }}\n\n  <cds-dropdown\n    [appendInline]=\"false\"\n    type=\"multi\"\n    [disabled]=\"disabled\"\n    selectionFeedback=\"fixed\"\n    (selected)=\"itemSelected($event)\"\n  >\n    <cds-dropdown-list\n      [items]=\"listItems\"\n      [listTpl]=\"colorDropdownItemTemplate\"\n    ></cds-dropdown-list>\n  </cds-dropdown>\n</cds-label>\n\n<ng-template #colorDropdownItemTemplate let-item=\"item\">\n  <div class=\"status-selector-dropdown-template\">\n    <cds-checkbox [checked]=\"item.selected\"></cds-checkbox>\n\n    <span *ngIf=\"item.key === CASES_WITHOUT_STATUS_KEY\" class=\"generic-span\">{{\n      item?.content\n    }}</span>\n\n    <cds-tag\n      *ngIf=\"item.key !== CASES_WITHOUT_STATUS_KEY\"\n      class=\"cds-tag--no-margin\"\n      [type]=\"item?.tagType\"\n      [title]=\"item?.content\"\n    >\n      {{ item?.content }}\n    </cds-tag>\n  </div>\n</ng-template>\n", styles: ["::ng-deep .status-selector .cds--label{width:100%;margin-bottom:0!important}::ng-deep .status-selector .cds--multiselect{margin-top:8px}::ng-deep .status-selector .cds--list-box__selection--multi{pointer-events:none}::ng-deep .status-selector .cds--list-box__selection--multi svg{pointer-events:auto}::ng-deep .status-selector-dropdown-template{display:flex;margin-top:-4px}::ng-deep .status-selector-dropdown-template .cds--tag{margin:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;display:inline-block;line-height:24px;max-width:100%}::ng-deep .status-selector-dropdown-template .generic-span{display:flex;align-items: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: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$4.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "pipe", type: i1$4.AsyncPipe, name: "async" }, { kind: "ngmodule", type: DropdownModule }, { kind: "component", type: i2$3.Dropdown, selector: "cds-dropdown, ibm-dropdown", inputs: ["id", "label", "hideLabel", "helperText", "placeholder", "displayValue", "clearText", "size", "type", "theme", "disabled", "readonly", "skeleton", "inline", "disableArrowKeys", "invalid", "invalidText", "warn", "warnText", "appendInline", "scrollableContainer", "itemValueKey", "selectionFeedback", "menuButtonLabel", "selectedLabel", "dropUp", "fluid"], outputs: ["selected", "onClose", "close"] }, { kind: "component", type: i2$3.DropdownList, selector: "cds-dropdown-list, ibm-dropdown-list", inputs: ["ariaLabel", "items", "listTpl", "type", "showTitles"], outputs: ["select", "scroll", "blurIntent"] }, { kind: "ngmodule", type: CheckboxModule }, { kind: "component", type: i2$3.Checkbox, selector: "cds-checkbox, ibm-checkbox", inputs: ["disabled", "skeleton", "hideLabel", "name", "id", "required", "value", "ariaLabel", "ariaLabelledby", "indeterminate", "checked"], outputs: ["click", "checkedChange", "indeterminateChange"] }, { kind: "ngmodule", type: InputModule$1 }, { kind: "component", type: i2$3.Label, selector: "cds-label, ibm-label", inputs: ["labelInputID", "disabled", "skeleton", "helperText", "invalidText", "invalid", "warn", "warnText", "ariaLabel"] }, { kind: "ngmodule", type: TranslateModule }, { kind: "pipe", type: i1.TranslatePipe, name: "translate" }, { kind: "ngmodule", type: TagModule }, { kind: "component", type: i2$3.Tag, selector: "cds-tag, ibm-tag", inputs: ["type", "size", "class", "skeleton"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.20", ngImport: i0, type: StatusSelectorComponent, decorators: [{
             type: Component,
@@ -15451,7 +15624,7 @@ class TableComponent {
             collectionSize,
             page,
             size,
-        })), tap(({ collectionSize, page, size }) => {
+        })), tap$1(({ collectionSize, page, size }) => {
             const amountOfPagesAvailable = Math.ceil(collectionSize / size);
             if (!this.skippingToPreviousPage &&
                 amountOfPagesAvailable > 0 &&
@@ -15524,7 +15697,7 @@ class TableComponent {
         });
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.20", ngImport: i0, type: TableComponent, deps: [{ token: i3.BreakpointObserver }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.20", type: TableComponent, isStandalone: false, selector: "v-table", inputs: { items: "items", columns: "columns", loading: "loading", showEditButtons: "showEditButtons", showPagination: "showPagination", editButtonTranslationKey: "editButtonTranslationKey", itemsTranslationKey: "itemsTranslationKey", noResultsTranslationKey: "noResultsTranslationKey", mobileBreakpointPx: "mobileBreakpointPx", amountOfLoadingRows: "amountOfLoadingRows", collectionSize: "collectionSize", page: "page", size: "size" }, outputs: { editButtonClicked: "editButtonClicked", paginationSizeSet: "paginationSizeSet", paginationPageSet: "paginationPageSet" }, 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<ng-container *ngIf=\"{items: items$ | async} as obs\">\n  <div class=\"v-table-container\">\n    <table class=\"v-table\">\n      <ng-container *ngTemplateOutlet=\"tableHead\"></ng-container>\n      <ng-container *ngTemplateOutlet=\"tableBody; context: {tableItems: obs.items}\"></ng-container>\n      <ng-container *ngTemplateOutlet=\"tableBodyLoading\"></ng-container>\n      <ng-container\n        *ngTemplateOutlet=\"tableBodyNoResults; context: {tableItems: obs.items}\"\n      ></ng-container>\n    </table>\n    <ng-container *ngIf=\"showPagination\">\n      <ng-container\n        *ngTemplateOutlet=\"paginationContainer; context: {tableItems: obs.items}\"\n      ></ng-container>\n    </ng-container>\n  </div>\n</ng-container>\n\n<ng-template #tableHead>\n  <thead *ngIf=\"columns\">\n    <tr>\n      <th class=\"v-table__header\" *ngFor=\"let column of columns\">\n        {{ column.labelTranslationKey | translate }}\n      </th>\n      <th *ngIf=\"showEditButtons\" class=\"v-table__header\"></th>\n    </tr>\n  </thead>\n</ng-template>\n\n<ng-template #tableBody let-tableItems=\"tableItems\">\n  <tbody class=\"v-table__body\" *ngIf=\"!loading && tableItems && tableItems?.length > 0\">\n    <tr *ngFor=\"let item of tableItems\" class=\"v-table__row\">\n      <ng-container *ngTemplateOutlet=\"tableCell; context: {item: item}\"></ng-container>\n      <ng-container *ngTemplateOutlet=\"tableEditButtonCell; context: {item: item}\"></ng-container>\n    </tr>\n  </tbody>\n</ng-template>\n\n<ng-template #tableBodyNoResults let-tableItems=\"tableItems\">\n  <tbody class=\"v-table__body\" *ngIf=\"!loading && tableItems && tableItems?.length === 0\">\n    <tr class=\"v-table__row\">\n      <td class=\"v-table__cell\" *ngFor=\"let column of columns; let i = index\">\n        <span *ngIf=\"i === 0\" class=\"v-table__cell-content\">\n          {{\n            noResultsTranslationKey\n              ? (noResultsTranslationKey | translate)\n              : ('interface.noResults' | translate)\n          }}\n        </span>\n      </td>\n    </tr>\n  </tbody>\n</ng-template>\n\n<ng-template #tableCell let-item=\"item\">\n  <td *ngFor=\"let column of columns\" class=\"v-table__cell\">\n    <span class=\"v-table__cell-content\">\n      {{ item[column.dataKey] }}\n    </span>\n  </td>\n</ng-template>\n\n<ng-template #tableEditButtonCell let-item=\"item\">\n  <td *ngIf=\"showEditButtons\" class=\"v-table__cell v-table__cell--with-button\">\n    <span class=\"v-table__cell-button-container\">\n      <button cdsButton=\"secondary\" (click)=\"editButtonClicked.emit(item)\">\n        {{ editButtonTranslationKey || 'interface.edit' | translate }}\n      </button>\n    </span>\n  </td>\n</ng-template>\n\n<ng-template #tableBodyLoading>\n  <tbody class=\"v-table__body\" *ngIf=\"loading\">\n    <tr *ngFor=\"let item of getArrayOfLength(amountOfLoadingRows)\" class=\"v-table__row\">\n      <ng-container *ngTemplateOutlet=\"tableCellLoading\"></ng-container>\n      <ng-container *ngTemplateOutlet=\"tableEditButtonCellLoading\"></ng-container>\n    </tr>\n  </tbody>\n</ng-template>\n\n<ng-template #tableCellLoading>\n  <td *ngFor=\"let column of columns\" class=\"v-table__cell\">\n    <span class=\"v-table__cell-content\"\n      ><ngx-skeleton-loader\n        appearance=\"line\"\n        [theme]=\"{\n          width: 'var(--v-table-loading-skeleton-width)',\n          height: 'var(--v-table-loading-skeleton-line-height)',\n          margin: '0',\n          'background-color': 'var(--v-table-loading-skeleton-bg-color)',\n        }\"\n      ></ngx-skeleton-loader\n    ></span>\n  </td>\n</ng-template>\n\n<ng-template #tableEditButtonCellLoading>\n  <td *ngIf=\"showEditButtons\" class=\"v-table__cell v-table__cell--with-button\">\n    <span class=\"v-table__cell-button-container\">\n      <button cdsButton=\"secondary\" [disabled]=\"true\">\n        {{ editButtonTranslationKey || 'interface.edit' | translate }}\n      </button>\n    </span>\n  </td>\n</ng-template>\n\n<ng-template #paginationContainer let-tableItems=\"tableItems\">\n  <div *ngIf=\"pagination$ | async as paginationObject\" class=\"v-table__pagination-container\">\n    <div class=\"v-table__pagination-size-container\">\n      <ng-container\n        *ngTemplateOutlet=\"paginationSizeSelect; context: {paginationObject: paginationObject}\"\n      ></ng-container>\n      <ng-container\n        *ngTemplateOutlet=\"\n          paginationSizeAmountText;\n          context: {paginationObject: paginationObject, tableItems: tableItems}\n        \"\n      ></ng-container>\n    </div>\n    <ng-container\n      *ngTemplateOutlet=\"paginationNavigation; context: {paginationObject: paginationObject}\"\n    ></ng-container>\n  </div>\n</ng-template>\n\n<ng-template #paginationSizeSelect let-paginationObject=\"paginationObject\">\n  <span class=\"v-table__pagination-size-text\">{{ 'interface.show' | translate }}</span>\n  <span class=\"v-table__pagination-size-select\">\n    <v-select\n      [items]=\"paginationOptions\"\n      [clearable]=\"false\"\n      [defaultSelection]=\"(defaultPaginationSize$ | async) || paginationOptions[0]\"\n      [disabled]=\"loading\"\n      (selectedChange)=\"setPaginationSize($event)\"\n    ></v-select>\n  </span>\n  <span class=\"v-table__pagination-size-text\">{{\n    itemsTranslationKey ? (itemsTranslationKey | translate) : ('interface.items' | translate)\n  }}</span>\n</ng-template>\n\n<ng-template\n  #paginationSizeAmountText\n  let-paginationObject=\"paginationObject\"\n  let-tableItems=\"tableItems\"\n>\n  <ng-container *ngTemplateOutlet=\"paginationSizeAmountTextLoading\"></ng-container>\n  <span\n    class=\"v-table__pagination-amount-text\"\n    *ngIf=\"!loading && tableItems && paginationObject\"\n    >{{\n      tableItems.length +\n        ' ' +\n        ('interface.of' | translate) +\n        ' ' +\n        paginationObject.collectionSize +\n        ' ' +\n        (itemsTranslationKey\n          ? (itemsTranslationKey | translate)\n          : ('interface.items' | translate)) +\n        ' ' +\n        ('interface.visible' | translate)\n    }}</span\n  >\n</ng-template>\n\n<ng-template #paginationSizeAmountTextLoading>\n  <span class=\"v-table__pagination-amount-text\" *ngIf=\"loading\"\n    ><ngx-skeleton-loader\n      appearance=\"line\"\n      [theme]=\"{\n        width: 'var(--v-table-loading-skeleton-width)',\n        height: 'var(--v-table-loading-skeleton-line-height)',\n        margin: '0',\n        'background-color': 'var(--v-table-loading-skeleton-pagination-size-bg-color)',\n      }\"\n    ></ngx-skeleton-loader\n  ></span>\n</ng-template>\n\n<ng-template #paginationNavigation let-paginationObject=\"paginationObject\">\n  <div\n    class=\"v-table__pagination-navigation-container\"\n    *ngIf=\"paginationObject && paginationObject.collectionSize > paginationObject.size\"\n  >\n    <span *ngIf=\"paginationObject.page > 1\">\n      <button cdsButton=\"ghost\" (click)=\"setPage('previous')\" [disabled]=\"loading\">\n        {{ 'interface.previous' | translate }}\n      </button>\n    </span>\n\n    <span *ngIf=\"paginationObject.page * paginationObject.size < paginationObject.collectionSize\">\n      <button cdsButton=\"ghost\" (click)=\"setPage('next')\" [disabled]=\"loading\">\n        {{ 'interface.nextArrow' | translate }}\n      </button>\n    </span>\n  </div>\n</ng-template>\n", styles: [".v-table-container{width:100%;display:flex;flex-direction:column}.v-table{width:100%;border-spacing:var(--v-table-border-spacing);table-layout:var(--v-table-layout)}.v-table__header{color:var(--v-table-header-font-color);text-transform:var(--v-table-header-text-transform);font-size:var(--v-table-header-font-size);font-weight:var(--v-table-header-font-weight);letter-spacing:var(--v-table-header-letter-spacing);padding-block-end:var(--v-table-header-padding-block-end);padding-inline-start:var(--v-table-cell-padding-inline);padding-inline-end:var(--v-table-cell-padding-inline)}.v-table__header:first-child{padding-inline-start:var(--v-table-first-cell-padding-inline-start)}.v-table__body{outline:var(--v-table-body-border);border-radius:var(--v-border-radius-md)}.v-table__row{border-bottom:var(--v-table-row-bottom-border)}.v-table__row:first-child .v-table__cell:first-child{border-top-left-radius:var(--v-border-radius-md)}.v-table__row:first-child .v-table__cell:last-child{border-top-right-radius:var(--v-border-radius-md)}.v-table__row:last-child{border-bottom:none}.v-table__row:last-child .v-table__cell:first-child{border-bottom-left-radius:var(--v-border-radius-md)}.v-table__row:last-child .v-table__cell:last-child{border-bottom-right-radius:var(--v-border-radius-md)}.v-table__cell{padding-block-start:var(--v-table-cell-padding-block);padding-block-end:var(--v-table-cell-padding-block);padding-inline-start:var(--v-table-cell-padding-inline);padding-inline-end:var(--v-table-cell-padding-inline);background-color:var(--v-table-background-color);font-size:var(--v-font-size-smaller);font-weight:var(--v-font-weight-bold);line-height:var(--v-line-height-smaller);width:var(--v-table-cell-width)}.v-table__cell:first-child{padding-inline-start:var(--v-table-first-cell-padding-inline-start)}.v-table__cell-content{display:flex;color:var(--v-table-cell-font-color);padding-block-start:var(--v-table-cell-content-padding-block);padding-block-end:var(--v-table-cell-content-padding-block)}.v-table__cell--with-button{width:.1%;white-space:nowrap}.v-table__cell-button-container{display:flex}ngx-skeleton-loader{display:flex}.v-table__pagination-container{display:flex;width:100%;flex-direction:row;justify-content:space-between;margin-block-start:var(--v-table-pagination-margin-block)}.v-table__pagination-size-container{display:flex;flex-direction:row;align-items:center}.v-table__pagination-size-container span:not(:last-child){margin-inline-end:var(--v-table-pagination-size-spacing-inline)}.v-table__pagination-size-text{color:var(--v-table-pagination-size-text-color);font-size:var(--v-table-pagination-size-text-font-size);font-weight:var(--v-table-pagination-size-text-font-weight)}.v-table__pagination-size-select{display:flex}.v-table__pagination-amount-text{margin-inline-start:var(--v-table-pagination-amount-text-margin-inline);color:var(--v-table-pagination-size-text-color);font-size:var(--v-table-pagination-size-text-font-size);font-weight:var(--v-table-pagination-amount-text-font-weight)}.v-table__pagination-navigation-container{display:flex;flex-direction:row}.v-table__pagination-navigation-container span:not(:last-child){margin-inline-end:var(--v-table-pagination-button-spacing-inline)}\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.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: "directive", type: i2$2.Button, selector: "[cdsButton], [ibmButton]", inputs: ["ibmButton", "cdsButton", "size", "skeleton", "iconOnly", "isExpressive"] }, { kind: "component", type: i2$1.NgxSkeletonLoaderComponent, selector: "ngx-skeleton-loader", inputs: ["count", "loadingText", "appearance", "animation", "ariaLabel", "theme"] }, { 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: "pipe", type: i1$4.AsyncPipe, name: "async" }, { kind: "pipe", type: i1.TranslatePipe, name: "translate" }] }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.20", type: TableComponent, isStandalone: false, selector: "v-table", inputs: { items: "items", columns: "columns", loading: "loading", showEditButtons: "showEditButtons", showPagination: "showPagination", editButtonTranslationKey: "editButtonTranslationKey", itemsTranslationKey: "itemsTranslationKey", noResultsTranslationKey: "noResultsTranslationKey", mobileBreakpointPx: "mobileBreakpointPx", amountOfLoadingRows: "amountOfLoadingRows", collectionSize: "collectionSize", page: "page", size: "size" }, outputs: { editButtonClicked: "editButtonClicked", paginationSizeSet: "paginationSizeSet", paginationPageSet: "paginationPageSet" }, 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<ng-container *ngIf=\"{items: items$ | async} as obs\">\n  <div class=\"v-table-container\">\n    <table class=\"v-table\">\n      <ng-container *ngTemplateOutlet=\"tableHead\"></ng-container>\n      <ng-container *ngTemplateOutlet=\"tableBody; context: {tableItems: obs.items}\"></ng-container>\n      <ng-container *ngTemplateOutlet=\"tableBodyLoading\"></ng-container>\n      <ng-container\n        *ngTemplateOutlet=\"tableBodyNoResults; context: {tableItems: obs.items}\"\n      ></ng-container>\n    </table>\n    <ng-container *ngIf=\"showPagination\">\n      <ng-container\n        *ngTemplateOutlet=\"paginationContainer; context: {tableItems: obs.items}\"\n      ></ng-container>\n    </ng-container>\n  </div>\n</ng-container>\n\n<ng-template #tableHead>\n  <thead *ngIf=\"columns\">\n    <tr>\n      <th class=\"v-table__header\" *ngFor=\"let column of columns\">\n        {{ column.labelTranslationKey | translate }}\n      </th>\n      <th *ngIf=\"showEditButtons\" class=\"v-table__header\"></th>\n    </tr>\n  </thead>\n</ng-template>\n\n<ng-template #tableBody let-tableItems=\"tableItems\">\n  <tbody class=\"v-table__body\" *ngIf=\"!loading && tableItems && tableItems?.length > 0\">\n    <tr *ngFor=\"let item of tableItems\" class=\"v-table__row\">\n      <ng-container *ngTemplateOutlet=\"tableCell; context: {item: item}\"></ng-container>\n      <ng-container *ngTemplateOutlet=\"tableEditButtonCell; context: {item: item}\"></ng-container>\n    </tr>\n  </tbody>\n</ng-template>\n\n<ng-template #tableBodyNoResults let-tableItems=\"tableItems\">\n  <tbody class=\"v-table__body\" *ngIf=\"!loading && tableItems && tableItems?.length === 0\">\n    <tr class=\"v-table__row\">\n      <td class=\"v-table__cell\" *ngFor=\"let column of columns; let i = index\">\n        <span *ngIf=\"i === 0\" class=\"v-table__cell-content\">\n          {{\n            noResultsTranslationKey\n              ? (noResultsTranslationKey | translate)\n              : ('interface.noResults' | translate)\n          }}\n        </span>\n      </td>\n    </tr>\n  </tbody>\n</ng-template>\n\n<ng-template #tableCell let-item=\"item\">\n  <td *ngFor=\"let column of columns\" class=\"v-table__cell\">\n    <span class=\"v-table__cell-content\">\n      {{ item[column.dataKey] }}\n    </span>\n  </td>\n</ng-template>\n\n<ng-template #tableEditButtonCell let-item=\"item\">\n  <td *ngIf=\"showEditButtons\" class=\"v-table__cell v-table__cell--with-button\">\n    <span class=\"v-table__cell-button-container\">\n      <button cdsButton=\"secondary\" (click)=\"editButtonClicked.emit(item)\">\n        {{ editButtonTranslationKey || 'interface.edit' | translate }}\n      </button>\n    </span>\n  </td>\n</ng-template>\n\n<ng-template #tableBodyLoading>\n  <tbody class=\"v-table__body\" *ngIf=\"loading\">\n    <tr *ngFor=\"let item of getArrayOfLength(amountOfLoadingRows)\" class=\"v-table__row\">\n      <ng-container *ngTemplateOutlet=\"tableCellLoading\"></ng-container>\n      <ng-container *ngTemplateOutlet=\"tableEditButtonCellLoading\"></ng-container>\n    </tr>\n  </tbody>\n</ng-template>\n\n<ng-template #tableCellLoading>\n  <td *ngFor=\"let column of columns\" class=\"v-table__cell\">\n    <span class=\"v-table__cell-content\"\n      ><ngx-skeleton-loader\n        appearance=\"line\"\n        [theme]=\"{\n          width: 'var(--v-table-loading-skeleton-width)',\n          height: 'var(--v-table-loading-skeleton-line-height)',\n          margin: '0',\n          'background-color': 'var(--v-table-loading-skeleton-bg-color)',\n        }\"\n      ></ngx-skeleton-loader\n    ></span>\n  </td>\n</ng-template>\n\n<ng-template #tableEditButtonCellLoading>\n  <td *ngIf=\"showEditButtons\" class=\"v-table__cell v-table__cell--with-button\">\n    <span class=\"v-table__cell-button-container\">\n      <button cdsButton=\"secondary\" [disabled]=\"true\">\n        {{ editButtonTranslationKey || 'interface.edit' | translate }}\n      </button>\n    </span>\n  </td>\n</ng-template>\n\n<ng-template #paginationContainer let-tableItems=\"tableItems\">\n  <div *ngIf=\"pagination$ | async as paginationObject\" class=\"v-table__pagination-container\">\n    <div class=\"v-table__pagination-size-container\">\n      <ng-container\n        *ngTemplateOutlet=\"paginationSizeSelect; context: {paginationObject: paginationObject}\"\n      ></ng-container>\n      <ng-container\n        *ngTemplateOutlet=\"\n          paginationSizeAmountText;\n          context: {paginationObject: paginationObject, tableItems: tableItems}\n        \"\n      ></ng-container>\n    </div>\n    <ng-container\n      *ngTemplateOutlet=\"paginationNavigation; context: {paginationObject: paginationObject}\"\n    ></ng-container>\n  </div>\n</ng-template>\n\n<ng-template #paginationSizeSelect let-paginationObject=\"paginationObject\">\n  <span class=\"v-table__pagination-size-text\">{{ 'interface.show' | translate }}</span>\n  <span class=\"v-table__pagination-size-select\">\n    <v-select\n      [items]=\"paginationOptions\"\n      [clearable]=\"false\"\n      [defaultSelection]=\"(defaultPaginationSize$ | async) || paginationOptions[0]\"\n      [disabled]=\"loading\"\n      (selectedChange)=\"setPaginationSize($event)\"\n    ></v-select>\n  </span>\n  <span class=\"v-table__pagination-size-text\">{{\n    itemsTranslationKey ? (itemsTranslationKey | translate) : ('interface.items' | translate)\n  }}</span>\n</ng-template>\n\n<ng-template\n  #paginationSizeAmountText\n  let-paginationObject=\"paginationObject\"\n  let-tableItems=\"tableItems\"\n>\n  <ng-container *ngTemplateOutlet=\"paginationSizeAmountTextLoading\"></ng-container>\n  <span\n    class=\"v-table__pagination-amount-text\"\n    *ngIf=\"!loading && tableItems && paginationObject\"\n    >{{\n      tableItems.length +\n        ' ' +\n        ('interface.of' | translate) +\n        ' ' +\n        paginationObject.collectionSize +\n        ' ' +\n        (itemsTranslationKey\n          ? (itemsTranslationKey | translate)\n          : ('interface.items' | translate)) +\n        ' ' +\n        ('interface.visible' | translate)\n    }}</span\n  >\n</ng-template>\n\n<ng-template #paginationSizeAmountTextLoading>\n  <span class=\"v-table__pagination-amount-text\" *ngIf=\"loading\"\n    ><ngx-skeleton-loader\n      appearance=\"line\"\n      [theme]=\"{\n        width: 'var(--v-table-loading-skeleton-width)',\n        height: 'var(--v-table-loading-skeleton-line-height)',\n        margin: '0',\n        'background-color': 'var(--v-table-loading-skeleton-pagination-size-bg-color)',\n      }\"\n    ></ngx-skeleton-loader\n  ></span>\n</ng-template>\n\n<ng-template #paginationNavigation let-paginationObject=\"paginationObject\">\n  <div\n    class=\"v-table__pagination-navigation-container\"\n    *ngIf=\"paginationObject && paginationObject.collectionSize > paginationObject.size\"\n  >\n    <span *ngIf=\"paginationObject.page > 1\">\n      <button cdsButton=\"ghost\" (click)=\"setPage('previous')\" [disabled]=\"loading\">\n        {{ 'interface.previous' | translate }}\n      </button>\n    </span>\n\n    <span *ngIf=\"paginationObject.page * paginationObject.size < paginationObject.collectionSize\">\n      <button cdsButton=\"ghost\" (click)=\"setPage('next')\" [disabled]=\"loading\">\n        {{ 'interface.nextArrow' | translate }}\n      </button>\n    </span>\n  </div>\n</ng-template>\n", styles: [".v-table-container{width:100%;display:flex;flex-direction:column}.v-table{width:100%;border-spacing:var(--v-table-border-spacing);table-layout:var(--v-table-layout)}.v-table__header{color:var(--v-table-header-font-color);text-transform:var(--v-table-header-text-transform);font-size:var(--v-table-header-font-size);font-weight:var(--v-table-header-font-weight);letter-spacing:var(--v-table-header-letter-spacing);padding-block-end:var(--v-table-header-padding-block-end);padding-inline-start:var(--v-table-cell-padding-inline);padding-inline-end:var(--v-table-cell-padding-inline)}.v-table__header:first-child{padding-inline-start:var(--v-table-first-cell-padding-inline-start)}.v-table__body{outline:var(--v-table-body-border);border-radius:var(--v-border-radius-md)}.v-table__row{border-bottom:var(--v-table-row-bottom-border)}.v-table__row:first-child .v-table__cell:first-child{border-top-left-radius:var(--v-border-radius-md)}.v-table__row:first-child .v-table__cell:last-child{border-top-right-radius:var(--v-border-radius-md)}.v-table__row:last-child{border-bottom:none}.v-table__row:last-child .v-table__cell:first-child{border-bottom-left-radius:var(--v-border-radius-md)}.v-table__row:last-child .v-table__cell:last-child{border-bottom-right-radius:var(--v-border-radius-md)}.v-table__cell{padding-block-start:var(--v-table-cell-padding-block);padding-block-end:var(--v-table-cell-padding-block);padding-inline-start:var(--v-table-cell-padding-inline);padding-inline-end:var(--v-table-cell-padding-inline);background-color:var(--v-table-background-color);font-size:var(--v-font-size-smaller);font-weight:var(--v-font-weight-bold);line-height:var(--v-line-height-smaller);width:var(--v-table-cell-width)}.v-table__cell:first-child{padding-inline-start:var(--v-table-first-cell-padding-inline-start)}.v-table__cell-content{display:flex;color:var(--v-table-cell-font-color);padding-block-start:var(--v-table-cell-content-padding-block);padding-block-end:var(--v-table-cell-content-padding-block)}.v-table__cell--with-button{width:.1%;white-space:nowrap}.v-table__cell-button-container{display:flex}ngx-skeleton-loader{display:flex}.v-table__pagination-container{display:flex;width:100%;flex-direction:row;justify-content:space-between;margin-block-start:var(--v-table-pagination-margin-block)}.v-table__pagination-size-container{display:flex;flex-direction:row;align-items:center}.v-table__pagination-size-container span:not(:last-child){margin-inline-end:var(--v-table-pagination-size-spacing-inline)}.v-table__pagination-size-text{color:var(--v-table-pagination-size-text-color);font-size:var(--v-table-pagination-size-text-font-size);font-weight:var(--v-table-pagination-size-text-font-weight)}.v-table__pagination-size-select{display:flex}.v-table__pagination-amount-text{margin-inline-start:var(--v-table-pagination-amount-text-margin-inline);color:var(--v-table-pagination-size-text-color);font-size:var(--v-table-pagination-size-text-font-size);font-weight:var(--v-table-pagination-amount-text-font-weight)}.v-table__pagination-navigation-container{display:flex;flex-direction:row}.v-table__pagination-navigation-container span:not(:last-child){margin-inline-end:var(--v-table-pagination-button-spacing-inline)}\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.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: "directive", type: i2$3.Button, selector: "[cdsButton], [ibmButton]", inputs: ["ibmButton", "cdsButton", "size", "skeleton", "iconOnly", "isExpressive"] }, { kind: "component", type: i2$1.NgxSkeletonLoaderComponent, selector: "ngx-skeleton-loader", inputs: ["count", "loadingText", "appearance", "animation", "ariaLabel", "theme"] }, { 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: "pipe", type: i1$4.AsyncPipe, name: "async" }, { kind: "pipe", type: i1.TranslatePipe, name: "translate" }] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.20", ngImport: i0, type: TableComponent, decorators: [{
             type: Component,
@@ -15658,13 +15831,13 @@ class VModalComponent {
     setAppearingDelayInService() {
         this.modalService.setAppearingDelay(this.appearingDelayMs);
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.20", ngImport: i0, type: VModalComponent, deps: [{ token: ModalService }, { token: i2$2.IconService }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.20", type: VModalComponent, isStandalone: false, selector: "v-modal", inputs: { appearingDelayMs: "appearingDelayMs", maxWidthPx: "maxWidthPx", hideFooter: "hideFooter", parentId: "parentId" }, outputs: { closeEvent: "closeEvent" }, 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<ng-container\n  *ngIf=\"{\n    visible: visible$ | async,\n    appearing: appearing$ | async,\n    disappearing: disappearing$ | async,\n    showBackdrop: showBackdrop$ | async,\n    mouseInsideModal: mouseInsideModal$ | async,\n  } as obs\"\n>\n  <div\n    class=\"v-modal-backdrop\"\n    [ngClass]=\"{\n      'v-modal-backdrop--visible': obs.visible || obs.disappearing,\n      'v-modal-backdrop--backdrop': obs.showBackdrop,\n      'v-modal-backdrop--hidden': !obs.visible,\n      'v-modal-backdrop--appearing': obs.appearing,\n      'v-modal-backdrop--disappearing': obs.disappearing,\n      'v-modal-backdrop--mouse-on-backdrop': !obs.mouseInsideModal,\n    }\"\n  >\n    <ng-container\n      *ngTemplateOutlet=\"modal; context: {appearing: obs.appearing, disappearing: obs.disappearing}\"\n    ></ng-container>\n  </div>\n</ng-container>\n\n<ng-template #modal let-appearing=\"appearing\" let-disappearing=\"disappearing\">\n  <div\n    class=\"v-modal\"\n    (mouseenter)=\"modalMouseEnter()\"\n    (mouseleave)=\"modalMouseLeave()\"\n    [style.max-width.px]=\"maxWidthPx\"\n  >\n    <ng-container\n      *ngTemplateOutlet=\"modalHeader; context: {appearing: appearing, disappearing: disappearing}\"\n    ></ng-container>\n    <ng-container *ngTemplateOutlet=\"modalContent\"></ng-container>\n    <ng-container *ngTemplateOutlet=\"modalFooter\"></ng-container>\n  </div>\n</ng-template>\n\n<ng-template #modalHeader let-appearing=\"appearing\" let-disappearing=\"disappearing\">\n  <div class=\"v-modal__header\">\n    <ng-content select=\"div[role=header]\"></ng-content>\n    <div class=\"v-modal__header-overflow\">\n      <div class=\"v-modal__header-overflow-gradient\"></div>\n      <div class=\"v-modal__header-overflow-bg\"></div>\n    </div>\n    <div class=\"v-modal__header-buttons\">\n      <button cdsButton=\"ghost\" iconOnly=\"true\" (click)=\"closeModal()\" size=\"sm\">\n        <svg cdsIcon=\"close\" size=\"16\"></svg>\n      </button>\n    </div>\n  </div>\n</ng-template>\n\n<ng-template #modalContent>\n  <div class=\"v-modal__content\">\n    <ng-content select=\"div[role=content]\"></ng-content>\n  </div>\n</ng-template>\n\n<ng-template #modalFooter>\n  <div class=\"v-modal__footer\" [ngClass]=\"{'v-modal__footer--hidden': hideFooter}\">\n    <ng-content select=\"div[role=footer]\"></ng-content>\n  </div>\n</ng-template>\n", styles: [".v-modal-backdrop{position:fixed;top:0;left:0;width:100%;height:100%;z-index:var(--v-modal-z-index);background-color:var(--v-color-backdrop-transparant);backdrop-filter:blur(0);transition:var(--v-modal-backdrop-transition);display:none;cursor:var(--v-modal-backdrop-cursor);padding-inline-start:var(--v-modal-backdrop-padding-inline);padding-inline-end:var(--v-modal-backdrop-padding-inline);padding-block-start:var(--v-modal-backdrop-padding-block);padding-block-end:var(--v-modal-backdrop-padding-block)}.v-modal-backdrop--visible,.v-modal-backdrop--disappearing{display:flex;align-items:center;justify-content:flex-end}.v-modal{position:relative;right:-100%;background-color:var(--v-modal-background-color);height:100%;min-height:var(--v-modal-min-height);max-height:100%;width:100%;max-width:var(--v-modal-max-width);opacity:0;transition:var(--v-modal-transition);cursor:var(--v-modal-cursor);border-radius:var(--v-modal-border-radius);overflow:hidden;display:flex;flex-direction:column;justify-content:space-between;box-shadow:var(--v-modal-box-shadow)}.v-modal-backdrop--backdrop{background-color:var(--v-modal-backdrop-color);backdrop-filter:var(--v-modal-backdrop-filter)}.v-modal-backdrop--backdrop .v-modal{right:0;opacity:1}.v-modal-backdrop--backdrop.v-modal-backdrop--mouse-on-backdrop:not(.v-modal-backdrop--disappearing),.v-modal-backdrop--backdrop.v-modal-backdrop--mouse-on-backdrop:not(.v-modal-backdrop--appearing),.v-modal-backdrop--backdrop.v-modal-backdrop--mouse-on-backdrop:hover{background-color:var(--v-modal-backdrop-color-hover);backdrop-filter:var(--v-modal-backdrop-filter-hover)}.v-modal-backdrop--hidden,.v-modal-backdrop--appearing{cursor:var(--v-modal-backdrop-cursor-disappearing)}.v-modal__header{position:relative;display:flex;flex-direction:row;justify-content:center;align-items:center;flex-shrink:0;background-color:var(--v-modal-header-bg-color);padding-block-start:var(--v-modal-header-padding-block);padding-block-end:var(--v-modal-header-padding-block);padding-inline-start:var(--v-modal-padding-inline);padding-inline-end:var(--v-modal-padding-inline);border-bottom:var(--v-modal-header-border);min-height:var(--v-modal-header-min-height);box-sizing:content-box}.v-modal__header-buttons{position:absolute;right:var(--v-modal-padding-inline);top:var(--v-modal-header-padding-block)}.v-modal__header-overflow{position:absolute;right:var(--v-modal-padding-inline);top:var(--v-modal-header-padding-block);height:calc(100% - var(--v-modal-header-padding-block) - var(--v-modal-header-padding-block));display:flex;flex-direction:row}.v-modal__header-overflow-gradient{width:var(--v-modal-header-overflow-gradient-width);height:100%;background-image:var(--v-modal-header-overflow-gradient-bg-image)}.v-modal__header-overflow-bg{width:var(--v-modal-header-overflow-width);height:100%;background-color:var(--v-modal-header-bg-color)}.v-modal__footer{display:flex;flex-shrink:0;background-color:var(--v-modal-footer-bg-color);padding-block-start:var(--v-modal-footer-padding-block);padding-block-end:var(--v-modal-footer-padding-block);padding-inline-start:var(--v-modal-padding-inline);padding-inline-end:var(--v-modal-padding-inline);border-top:var(--v-modal-footer-border)}.v-modal__footer--hidden{display:none}.v-modal__content{height:100%;padding-block-start:var(--v-modal-content-padding-block-start);padding-block-end:var(--v-modal-content-padding-block-end);padding-inline-start:var(--v-modal-padding-inline);padding-inline-end:var(--v-modal-padding-inline);overflow:auto}::ng-deep .v-modal div[role=header],::ng-deep .v-modal div[role=content],::ng-deep .v-modal div[role=footer]{width:100%}\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.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1$4.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i2$2.Button, selector: "[cdsButton], [ibmButton]", inputs: ["ibmButton", "cdsButton", "size", "skeleton", "iconOnly", "isExpressive"] }, { kind: "directive", type: i2$2.IconDirective, selector: "[cdsIcon], [ibmIcon]", inputs: ["ibmIcon", "cdsIcon", "size", "title", "ariaLabel", "ariaLabelledBy", "ariaHidden", "isFocusable"] }, { kind: "pipe", type: i1$4.AsyncPipe, name: "async" }] }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.20", ngImport: i0, type: VModalComponent, deps: [{ token: ModalService }, { token: i2$3.IconService }], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.20", type: VModalComponent, isStandalone: false, selector: "v-modal", inputs: { appearingDelayMs: "appearingDelayMs", maxWidthPx: "maxWidthPx", hideFooter: "hideFooter", parentId: "parentId" }, outputs: { closeEvent: "closeEvent" }, 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<ng-container\n  *ngIf=\"{\n    visible: visible$ | async,\n    appearing: appearing$ | async,\n    disappearing: disappearing$ | async,\n    showBackdrop: showBackdrop$ | async,\n    mouseInsideModal: mouseInsideModal$ | async,\n  } as obs\"\n>\n  <div\n    class=\"v-modal-backdrop\"\n    [ngClass]=\"{\n      'v-modal-backdrop--visible': obs.visible || obs.disappearing,\n      'v-modal-backdrop--backdrop': obs.showBackdrop,\n      'v-modal-backdrop--hidden': !obs.visible,\n      'v-modal-backdrop--appearing': obs.appearing,\n      'v-modal-backdrop--disappearing': obs.disappearing,\n      'v-modal-backdrop--mouse-on-backdrop': !obs.mouseInsideModal,\n    }\"\n  >\n    <ng-container\n      *ngTemplateOutlet=\"modal; context: {appearing: obs.appearing, disappearing: obs.disappearing}\"\n    ></ng-container>\n  </div>\n</ng-container>\n\n<ng-template #modal let-appearing=\"appearing\" let-disappearing=\"disappearing\">\n  <div\n    class=\"v-modal\"\n    (mouseenter)=\"modalMouseEnter()\"\n    (mouseleave)=\"modalMouseLeave()\"\n    [style.max-width.px]=\"maxWidthPx\"\n  >\n    <ng-container\n      *ngTemplateOutlet=\"modalHeader; context: {appearing: appearing, disappearing: disappearing}\"\n    ></ng-container>\n    <ng-container *ngTemplateOutlet=\"modalContent\"></ng-container>\n    <ng-container *ngTemplateOutlet=\"modalFooter\"></ng-container>\n  </div>\n</ng-template>\n\n<ng-template #modalHeader let-appearing=\"appearing\" let-disappearing=\"disappearing\">\n  <div class=\"v-modal__header\">\n    <ng-content select=\"div[role=header]\"></ng-content>\n    <div class=\"v-modal__header-overflow\">\n      <div class=\"v-modal__header-overflow-gradient\"></div>\n      <div class=\"v-modal__header-overflow-bg\"></div>\n    </div>\n    <div class=\"v-modal__header-buttons\">\n      <button cdsButton=\"ghost\" iconOnly=\"true\" (click)=\"closeModal()\" size=\"sm\">\n        <svg cdsIcon=\"close\" size=\"16\"></svg>\n      </button>\n    </div>\n  </div>\n</ng-template>\n\n<ng-template #modalContent>\n  <div class=\"v-modal__content\">\n    <ng-content select=\"div[role=content]\"></ng-content>\n  </div>\n</ng-template>\n\n<ng-template #modalFooter>\n  <div class=\"v-modal__footer\" [ngClass]=\"{'v-modal__footer--hidden': hideFooter}\">\n    <ng-content select=\"div[role=footer]\"></ng-content>\n  </div>\n</ng-template>\n", styles: [".v-modal-backdrop{position:fixed;top:0;left:0;width:100%;height:100%;z-index:var(--v-modal-z-index);background-color:var(--v-color-backdrop-transparant);backdrop-filter:blur(0);transition:var(--v-modal-backdrop-transition);display:none;cursor:var(--v-modal-backdrop-cursor);padding-inline-start:var(--v-modal-backdrop-padding-inline);padding-inline-end:var(--v-modal-backdrop-padding-inline);padding-block-start:var(--v-modal-backdrop-padding-block);padding-block-end:var(--v-modal-backdrop-padding-block)}.v-modal-backdrop--visible,.v-modal-backdrop--disappearing{display:flex;align-items:center;justify-content:flex-end}.v-modal{position:relative;right:-100%;background-color:var(--v-modal-background-color);height:100%;min-height:var(--v-modal-min-height);max-height:100%;width:100%;max-width:var(--v-modal-max-width);opacity:0;transition:var(--v-modal-transition);cursor:var(--v-modal-cursor);border-radius:var(--v-modal-border-radius);overflow:hidden;display:flex;flex-direction:column;justify-content:space-between;box-shadow:var(--v-modal-box-shadow)}.v-modal-backdrop--backdrop{background-color:var(--v-modal-backdrop-color);backdrop-filter:var(--v-modal-backdrop-filter)}.v-modal-backdrop--backdrop .v-modal{right:0;opacity:1}.v-modal-backdrop--backdrop.v-modal-backdrop--mouse-on-backdrop:not(.v-modal-backdrop--disappearing),.v-modal-backdrop--backdrop.v-modal-backdrop--mouse-on-backdrop:not(.v-modal-backdrop--appearing),.v-modal-backdrop--backdrop.v-modal-backdrop--mouse-on-backdrop:hover{background-color:var(--v-modal-backdrop-color-hover);backdrop-filter:var(--v-modal-backdrop-filter-hover)}.v-modal-backdrop--hidden,.v-modal-backdrop--appearing{cursor:var(--v-modal-backdrop-cursor-disappearing)}.v-modal__header{position:relative;display:flex;flex-direction:row;justify-content:center;align-items:center;flex-shrink:0;background-color:var(--v-modal-header-bg-color);padding-block-start:var(--v-modal-header-padding-block);padding-block-end:var(--v-modal-header-padding-block);padding-inline-start:var(--v-modal-padding-inline);padding-inline-end:var(--v-modal-padding-inline);border-bottom:var(--v-modal-header-border);min-height:var(--v-modal-header-min-height);box-sizing:content-box}.v-modal__header-buttons{position:absolute;right:var(--v-modal-padding-inline);top:var(--v-modal-header-padding-block)}.v-modal__header-overflow{position:absolute;right:var(--v-modal-padding-inline);top:var(--v-modal-header-padding-block);height:calc(100% - var(--v-modal-header-padding-block) - var(--v-modal-header-padding-block));display:flex;flex-direction:row}.v-modal__header-overflow-gradient{width:var(--v-modal-header-overflow-gradient-width);height:100%;background-image:var(--v-modal-header-overflow-gradient-bg-image)}.v-modal__header-overflow-bg{width:var(--v-modal-header-overflow-width);height:100%;background-color:var(--v-modal-header-bg-color)}.v-modal__footer{display:flex;flex-shrink:0;background-color:var(--v-modal-footer-bg-color);padding-block-start:var(--v-modal-footer-padding-block);padding-block-end:var(--v-modal-footer-padding-block);padding-inline-start:var(--v-modal-padding-inline);padding-inline-end:var(--v-modal-padding-inline);border-top:var(--v-modal-footer-border)}.v-modal__footer--hidden{display:none}.v-modal__content{height:100%;padding-block-start:var(--v-modal-content-padding-block-start);padding-block-end:var(--v-modal-content-padding-block-end);padding-inline-start:var(--v-modal-padding-inline);padding-inline-end:var(--v-modal-padding-inline);overflow:auto}::ng-deep .v-modal div[role=header],::ng-deep .v-modal div[role=content],::ng-deep .v-modal div[role=footer]{width:100%}\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.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1$4.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i2$3.Button, selector: "[cdsButton], [ibmButton]", inputs: ["ibmButton", "cdsButton", "size", "skeleton", "iconOnly", "isExpressive"] }, { kind: "directive", type: i2$3.IconDirective, selector: "[cdsIcon], [ibmIcon]", inputs: ["ibmIcon", "cdsIcon", "size", "title", "ariaLabel", "ariaLabelledBy", "ariaHidden", "isFocusable"] }, { kind: "pipe", type: i1$4.AsyncPipe, name: "async" }] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.20", ngImport: i0, type: VModalComponent, decorators: [{
             type: Component,
             args: [{ selector: 'v-modal', 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<ng-container\n  *ngIf=\"{\n    visible: visible$ | async,\n    appearing: appearing$ | async,\n    disappearing: disappearing$ | async,\n    showBackdrop: showBackdrop$ | async,\n    mouseInsideModal: mouseInsideModal$ | async,\n  } as obs\"\n>\n  <div\n    class=\"v-modal-backdrop\"\n    [ngClass]=\"{\n      'v-modal-backdrop--visible': obs.visible || obs.disappearing,\n      'v-modal-backdrop--backdrop': obs.showBackdrop,\n      'v-modal-backdrop--hidden': !obs.visible,\n      'v-modal-backdrop--appearing': obs.appearing,\n      'v-modal-backdrop--disappearing': obs.disappearing,\n      'v-modal-backdrop--mouse-on-backdrop': !obs.mouseInsideModal,\n    }\"\n  >\n    <ng-container\n      *ngTemplateOutlet=\"modal; context: {appearing: obs.appearing, disappearing: obs.disappearing}\"\n    ></ng-container>\n  </div>\n</ng-container>\n\n<ng-template #modal let-appearing=\"appearing\" let-disappearing=\"disappearing\">\n  <div\n    class=\"v-modal\"\n    (mouseenter)=\"modalMouseEnter()\"\n    (mouseleave)=\"modalMouseLeave()\"\n    [style.max-width.px]=\"maxWidthPx\"\n  >\n    <ng-container\n      *ngTemplateOutlet=\"modalHeader; context: {appearing: appearing, disappearing: disappearing}\"\n    ></ng-container>\n    <ng-container *ngTemplateOutlet=\"modalContent\"></ng-container>\n    <ng-container *ngTemplateOutlet=\"modalFooter\"></ng-container>\n  </div>\n</ng-template>\n\n<ng-template #modalHeader let-appearing=\"appearing\" let-disappearing=\"disappearing\">\n  <div class=\"v-modal__header\">\n    <ng-content select=\"div[role=header]\"></ng-content>\n    <div class=\"v-modal__header-overflow\">\n      <div class=\"v-modal__header-overflow-gradient\"></div>\n      <div class=\"v-modal__header-overflow-bg\"></div>\n    </div>\n    <div class=\"v-modal__header-buttons\">\n      <button cdsButton=\"ghost\" iconOnly=\"true\" (click)=\"closeModal()\" size=\"sm\">\n        <svg cdsIcon=\"close\" size=\"16\"></svg>\n      </button>\n    </div>\n  </div>\n</ng-template>\n\n<ng-template #modalContent>\n  <div class=\"v-modal__content\">\n    <ng-content select=\"div[role=content]\"></ng-content>\n  </div>\n</ng-template>\n\n<ng-template #modalFooter>\n  <div class=\"v-modal__footer\" [ngClass]=\"{'v-modal__footer--hidden': hideFooter}\">\n    <ng-content select=\"div[role=footer]\"></ng-content>\n  </div>\n</ng-template>\n", styles: [".v-modal-backdrop{position:fixed;top:0;left:0;width:100%;height:100%;z-index:var(--v-modal-z-index);background-color:var(--v-color-backdrop-transparant);backdrop-filter:blur(0);transition:var(--v-modal-backdrop-transition);display:none;cursor:var(--v-modal-backdrop-cursor);padding-inline-start:var(--v-modal-backdrop-padding-inline);padding-inline-end:var(--v-modal-backdrop-padding-inline);padding-block-start:var(--v-modal-backdrop-padding-block);padding-block-end:var(--v-modal-backdrop-padding-block)}.v-modal-backdrop--visible,.v-modal-backdrop--disappearing{display:flex;align-items:center;justify-content:flex-end}.v-modal{position:relative;right:-100%;background-color:var(--v-modal-background-color);height:100%;min-height:var(--v-modal-min-height);max-height:100%;width:100%;max-width:var(--v-modal-max-width);opacity:0;transition:var(--v-modal-transition);cursor:var(--v-modal-cursor);border-radius:var(--v-modal-border-radius);overflow:hidden;display:flex;flex-direction:column;justify-content:space-between;box-shadow:var(--v-modal-box-shadow)}.v-modal-backdrop--backdrop{background-color:var(--v-modal-backdrop-color);backdrop-filter:var(--v-modal-backdrop-filter)}.v-modal-backdrop--backdrop .v-modal{right:0;opacity:1}.v-modal-backdrop--backdrop.v-modal-backdrop--mouse-on-backdrop:not(.v-modal-backdrop--disappearing),.v-modal-backdrop--backdrop.v-modal-backdrop--mouse-on-backdrop:not(.v-modal-backdrop--appearing),.v-modal-backdrop--backdrop.v-modal-backdrop--mouse-on-backdrop:hover{background-color:var(--v-modal-backdrop-color-hover);backdrop-filter:var(--v-modal-backdrop-filter-hover)}.v-modal-backdrop--hidden,.v-modal-backdrop--appearing{cursor:var(--v-modal-backdrop-cursor-disappearing)}.v-modal__header{position:relative;display:flex;flex-direction:row;justify-content:center;align-items:center;flex-shrink:0;background-color:var(--v-modal-header-bg-color);padding-block-start:var(--v-modal-header-padding-block);padding-block-end:var(--v-modal-header-padding-block);padding-inline-start:var(--v-modal-padding-inline);padding-inline-end:var(--v-modal-padding-inline);border-bottom:var(--v-modal-header-border);min-height:var(--v-modal-header-min-height);box-sizing:content-box}.v-modal__header-buttons{position:absolute;right:var(--v-modal-padding-inline);top:var(--v-modal-header-padding-block)}.v-modal__header-overflow{position:absolute;right:var(--v-modal-padding-inline);top:var(--v-modal-header-padding-block);height:calc(100% - var(--v-modal-header-padding-block) - var(--v-modal-header-padding-block));display:flex;flex-direction:row}.v-modal__header-overflow-gradient{width:var(--v-modal-header-overflow-gradient-width);height:100%;background-image:var(--v-modal-header-overflow-gradient-bg-image)}.v-modal__header-overflow-bg{width:var(--v-modal-header-overflow-width);height:100%;background-color:var(--v-modal-header-bg-color)}.v-modal__footer{display:flex;flex-shrink:0;background-color:var(--v-modal-footer-bg-color);padding-block-start:var(--v-modal-footer-padding-block);padding-block-end:var(--v-modal-footer-padding-block);padding-inline-start:var(--v-modal-padding-inline);padding-inline-end:var(--v-modal-padding-inline);border-top:var(--v-modal-footer-border)}.v-modal__footer--hidden{display:none}.v-modal__content{height:100%;padding-block-start:var(--v-modal-content-padding-block-start);padding-block-end:var(--v-modal-content-padding-block-end);padding-inline-start:var(--v-modal-padding-inline);padding-inline-end:var(--v-modal-padding-inline);overflow:auto}::ng-deep .v-modal div[role=header],::ng-deep .v-modal div[role=content],::ng-deep .v-modal div[role=footer]{width:100%}\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: ModalService }, { type: i2$2.IconService }], propDecorators: { appearingDelayMs: [{
+        }], ctorParameters: () => [{ type: ModalService }, { type: i2$3.IconService }], propDecorators: { appearingDelayMs: [{
                 type: Input
             }], maxWidthPx: [{
                 type: Input
@@ -15918,7 +16091,7 @@ class StepperFooterStepComponent {
         this.stepperService.complete();
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.20", ngImport: i0, type: StepperFooterStepComponent, deps: [{ token: StepperService }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.20", type: StepperFooterStepComponent, isStandalone: false, selector: "v-stepper-footer-step", inputs: { nextButtonEnabled: "nextButtonEnabled", completeButtonEnabled: "completeButtonEnabled", nextButtonTranslationKey: "nextButtonTranslationKey", cancelButtonTranslationKey: "cancelButtonTranslationKey", completeButtonTranslationKey: "completeButtonTranslationKey", completeButtonMdiIcon: "completeButtonMdiIcon", showCompleteButton: "showCompleteButton" }, 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 class=\"stepper-footer-step\" *ngIf=\"(currentStepIndex$ | async) === (stepIndex$ | async)\">\n  <ng-container *ngIf=\"{disabled: disabled$ | async, isLastStep: isLastStep$ | async} as obs\">\n    <ng-container\n      *ngTemplateOutlet=\"cancelButton; context: {disabled: obs.disabled}\"\n    ></ng-container>\n    <ng-container *ngIf=\"obs.isLastStep === false\">\n      <ng-container\n        *ngTemplateOutlet=\"nextButton; context: {disabled: obs.disabled}\"\n      ></ng-container>\n    </ng-container>\n    <ng-container *ngIf=\"obs.isLastStep === true && showCompleteButton\">\n      <ng-container\n        *ngTemplateOutlet=\"completeButton; context: {disabled: obs.disabled}\"\n      ></ng-container>\n    </ng-container>\n  </ng-container>\n</div>\n\n<ng-template #cancelButton let-disabled=\"disabled\">\n  <button\n    cdsButton=\"secondary\"\n    [attr.data-test-id]=\"testIds.cancelButton\"\n    (click)=\"cancel()\"\n    [disabled]=\"disabled\"\n  >\n    {{\n      cancelButtonTranslationKey\n        ? (cancelButtonTranslationKey | translate)\n        : ('stepper.cancelButtonText' | translate)\n    }}\n  </button>\n</ng-template>\n\n<ng-template #nextButton let-disabled=\"disabled\">\n  <button cdsButton=\"primary\" [disabled]=\"!nextButtonEnabled || disabled\" (click)=\"goToNextStep()\">\n    {{\n      nextButtonTranslationKey\n        ? (nextButtonTranslationKey | translate)\n        : ('stepper.nextButtonText' | translate)\n    }}\n  </button>\n</ng-template>\n\n<ng-template #completeButton let-disabled=\"disabled\">\n  <button cdsButton=\"primary\" [disabled]=\"!completeButtonEnabled || disabled\" (click)=\"complete()\">\n    {{\n      completeButtonTranslationKey\n        ? (completeButtonTranslationKey | translate)\n        : ('stepper.completeButtonText' | translate)\n    }}\n  </button>\n</ng-template>\n", styles: [".stepper-footer-step{display:flex;width:100%;flex-direction:row;justify-content:space-between}\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.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1$4.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i2$2.Button, selector: "[cdsButton], [ibmButton]", inputs: ["ibmButton", "cdsButton", "size", "skeleton", "iconOnly", "isExpressive"] }, { kind: "pipe", type: i1$4.AsyncPipe, name: "async" }, { kind: "pipe", type: i1.TranslatePipe, name: "translate" }] }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.20", type: StepperFooterStepComponent, isStandalone: false, selector: "v-stepper-footer-step", inputs: { nextButtonEnabled: "nextButtonEnabled", completeButtonEnabled: "completeButtonEnabled", nextButtonTranslationKey: "nextButtonTranslationKey", cancelButtonTranslationKey: "cancelButtonTranslationKey", completeButtonTranslationKey: "completeButtonTranslationKey", completeButtonMdiIcon: "completeButtonMdiIcon", showCompleteButton: "showCompleteButton" }, 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 class=\"stepper-footer-step\" *ngIf=\"(currentStepIndex$ | async) === (stepIndex$ | async)\">\n  <ng-container *ngIf=\"{disabled: disabled$ | async, isLastStep: isLastStep$ | async} as obs\">\n    <ng-container\n      *ngTemplateOutlet=\"cancelButton; context: {disabled: obs.disabled}\"\n    ></ng-container>\n    <ng-container *ngIf=\"obs.isLastStep === false\">\n      <ng-container\n        *ngTemplateOutlet=\"nextButton; context: {disabled: obs.disabled}\"\n      ></ng-container>\n    </ng-container>\n    <ng-container *ngIf=\"obs.isLastStep === true && showCompleteButton\">\n      <ng-container\n        *ngTemplateOutlet=\"completeButton; context: {disabled: obs.disabled}\"\n      ></ng-container>\n    </ng-container>\n  </ng-container>\n</div>\n\n<ng-template #cancelButton let-disabled=\"disabled\">\n  <button\n    cdsButton=\"secondary\"\n    [attr.data-test-id]=\"testIds.cancelButton\"\n    (click)=\"cancel()\"\n    [disabled]=\"disabled\"\n  >\n    {{\n      cancelButtonTranslationKey\n        ? (cancelButtonTranslationKey | translate)\n        : ('stepper.cancelButtonText' | translate)\n    }}\n  </button>\n</ng-template>\n\n<ng-template #nextButton let-disabled=\"disabled\">\n  <button cdsButton=\"primary\" [disabled]=\"!nextButtonEnabled || disabled\" (click)=\"goToNextStep()\">\n    {{\n      nextButtonTranslationKey\n        ? (nextButtonTranslationKey | translate)\n        : ('stepper.nextButtonText' | translate)\n    }}\n  </button>\n</ng-template>\n\n<ng-template #completeButton let-disabled=\"disabled\">\n  <button cdsButton=\"primary\" [disabled]=\"!completeButtonEnabled || disabled\" (click)=\"complete()\">\n    {{\n      completeButtonTranslationKey\n        ? (completeButtonTranslationKey | translate)\n        : ('stepper.completeButtonText' | translate)\n    }}\n  </button>\n</ng-template>\n", styles: [".stepper-footer-step{display:flex;width:100%;flex-direction:row;justify-content:space-between}\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.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1$4.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i2$3.Button, selector: "[cdsButton], [ibmButton]", inputs: ["ibmButton", "cdsButton", "size", "skeleton", "iconOnly", "isExpressive"] }, { kind: "pipe", type: i1$4.AsyncPipe, name: "async" }, { kind: "pipe", type: i1.TranslatePipe, name: "translate" }] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.20", ngImport: i0, type: StepperFooterStepComponent, decorators: [{
             type: Component,
@@ -16116,7 +16289,7 @@ class PromptComponent {
         this.promptService.setAppearingDelay(this.appearingDelayMs);
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.20", ngImport: i0, type: PromptComponent, deps: [{ token: PromptService }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.20", type: PromptComponent, isStandalone: false, selector: "v-prompt", inputs: { appearingDelayMs: "appearingDelayMs", maxWidthPx: "maxWidthPx" }, outputs: { closeEvent: "closeEvent" }, 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<ng-container\n  *ngIf=\"{\n    visible: visible$ | async,\n    appearing: appearing$ | async,\n    disappearing: disappearing$ | async,\n    showBackdrop: showBackdrop$ | async,\n  } as obs\"\n>\n  <div\n    class=\"v-prompt-backdrop\"\n    [ngClass]=\"{\n      'v-prompt-backdrop--visible': obs.visible || obs.disappearing,\n      'v-prompt-backdrop--backdrop': obs.showBackdrop,\n      'v-prompt-backdrop--hidden': !obs.visible,\n      'v-prompt-backdrop--appearing': obs.appearing,\n      'v-prompt-backdrop--disappearing': obs.disappearing,\n    }\"\n  >\n    <ng-container\n      *ngTemplateOutlet=\"modal; context: {appearing: obs.appearing, disappearing: obs.disappearing}\"\n    ></ng-container>\n  </div>\n</ng-container>\n\n<ng-template #modal let-appearing=\"appearing\" let-disappearing=\"disappearing\">\n  <div class=\"v-prompt\" [style.max-width.px]=\"maxWidthPx\">\n    <ng-container\n      *ngTemplateOutlet=\"modalHeader; context: {appearing: appearing, disappearing: disappearing}\"\n    ></ng-container>\n    <ng-container *ngTemplateOutlet=\"modalContent\"></ng-container>\n    <ng-container\n      *ngTemplateOutlet=\"modalFooter; context: {appearing: appearing, disappearing: disappearing}\"\n    ></ng-container>\n  </div>\n</ng-template>\n\n<ng-template #modalHeader let-appearing=\"appearing\" let-disappearing=\"disappearing\">\n  <div class=\"v-prompt__header\">\n    <h4>{{ headerText$ | async }}</h4>\n  </div>\n  <div class=\"v-prompt__close\" *ngIf=\"closeButtonVisible$ | async\">\n    <button type=\"button\" class=\"close\" aria-label=\"Close\" (click)=\"close()\">\n      <span aria-hidden=\"true\">&times;</span>\n    </button>\n  </div>\n</ng-template>\n\n<ng-template #modalContent>\n  <div class=\"v-prompt__content\">\n    <v-paragraph>{{ bodyText$ | async }}</v-paragraph>\n  </div>\n</ng-template>\n\n<ng-template #modalFooter let-appearing=\"appearing\" let-disappearing=\"disappearing\">\n  <div class=\"v-prompt__footer\">\n    <div class=\"v-prompt__buttons\">\n      <button cdsButton=\"primary\" [disabled]=\"appearing || disappearing\" (click)=\"cancel()\">\n        {{ cancelText$ | async }}\n      </button>\n\n      <button cdsButton=\"secondary\" [disabled]=\"appearing || disappearing\" (click)=\"confirm()\">\n        {{ confirmText$ | async }}\n      </button>\n    </div>\n  </div>\n</ng-template>\n", styles: [".v-prompt-backdrop{position:fixed;top:0;left:0;width:100%;height:100%;z-index:var(--v-prompt-z-index);background-color:var(--v-color-backdrop-transparant);backdrop-filter:blur(0);transition:var(--v-prompt-backdrop-transition);display:none;cursor:var(--v-prompt-backdrop-cursor);padding-inline-start:var(--v-prompt-backdrop-padding-inline);padding-inline-end:var(--v-prompt-backdrop-padding-inline);padding-block-start:var(--v-prompt-backdrop-padding-block);padding-block-end:var(--v-prompt-backdrop-padding-block)}.v-prompt-backdrop--visible,.v-prompt-backdrop--disappearing{display:flex;align-items:center;justify-content:center}.v-prompt{background-color:var(--v-prompt-background-color);min-height:var(--v-prompt-min-height);max-height:100%;width:100%;max-width:var(--v-prompt-max-width);transform:translateY(-100%);opacity:0;transition:var(--v-prompt-transition);cursor:var(--v-prompt-cursor);border-radius:var(--v-prompt-border-radius);overflow:hidden;display:flex;flex-direction:column;justify-content:space-between;box-shadow:var(--v-prompt-box-shadow)}.v-prompt-backdrop--backdrop{background-color:var(--v-prompt-backdrop-color);backdrop-filter:var(--v-prompt-backdrop-filter)}.v-prompt-backdrop--backdrop .v-prompt{transform:translateY(0);opacity:1}.v-prompt-backdrop--backdrop.v-prompt-backdrop--mouse-on-backdrop:not(.v-prompt-backdrop--disappearing),.v-prompt-backdrop--backdrop.v-prompt-backdrop--mouse-on-backdrop:not(.v-prompt-backdrop--appearing),.v-prompt-backdrop--backdrop.v-prompt-backdrop--mouse-on-backdrop:hover{background-color:var(--v-prompt-backdrop-color-hover);backdrop-filter:var(--v-prompt-backdrop-filter-hover)}.v-prompt-backdrop--hidden,.v-prompt-backdrop--appearing{cursor:var(--v-prompt-backdrop-cursor-disappearing)}.v-prompt__header{position:relative;display:flex;flex-direction:row;justify-content:center;align-items:center;flex-shrink:0;background-color:var(--v-prompt-header-bg-color);padding-block-start:var(--v-prompt-header-padding-block);padding-block-end:var(--v-prompt-header-padding-block);padding-inline-start:var(--v-prompt-padding-inline);padding-inline-end:var(--v-prompt-padding-inline);border-bottom:var(--v-prompt-header-border);min-height:var(--v-prompt-header-min-height);box-sizing:content-box}.v-prompt__close{position:absolute;top:0;right:0;padding-block-start:var(--v-prompt-border-radius);padding-block-end:var(--v-prompt-border-radius);padding-inline-start:var(--v-prompt-padding-inline);padding-inline-end:var(--v-prompt-padding-inline)}.v-prompt__footer{display:flex;flex-shrink:0;background-color:var(--v-prompt-footer-bg-color);padding-block-start:var(--v-prompt-footer-padding-block);padding-block-end:var(--v-prompt-footer-padding-block);padding-inline-start:var(--v-prompt-padding-inline);padding-inline-end:var(--v-prompt-padding-inline);border-top:var(--v-prompt-footer-border)}.v-prompt__content{height:100%;padding-block-start:var(--v-prompt-content-padding-block-start);padding-block-end:var(--v-prompt-content-padding-block-end);padding-inline-start:var(--v-prompt-padding-inline);padding-inline-end:var(--v-prompt-padding-inline);overflow:auto}.v-prompt__buttons{display:flex;flex-direction:row;width:100%;justify-content:space-between}\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.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1$4.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i2$2.Button, selector: "[cdsButton], [ibmButton]", inputs: ["ibmButton", "cdsButton", "size", "skeleton", "iconOnly", "isExpressive"] }, { kind: "component", type: ParagraphComponent, selector: "v-paragraph", inputs: ["center", "fullWidth", "margin", "italic", "loading", "dataTestId"] }, { kind: "pipe", type: i1$4.AsyncPipe, name: "async" }] }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.20", type: PromptComponent, isStandalone: false, selector: "v-prompt", inputs: { appearingDelayMs: "appearingDelayMs", maxWidthPx: "maxWidthPx" }, outputs: { closeEvent: "closeEvent" }, 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<ng-container\n  *ngIf=\"{\n    visible: visible$ | async,\n    appearing: appearing$ | async,\n    disappearing: disappearing$ | async,\n    showBackdrop: showBackdrop$ | async,\n  } as obs\"\n>\n  <div\n    class=\"v-prompt-backdrop\"\n    [ngClass]=\"{\n      'v-prompt-backdrop--visible': obs.visible || obs.disappearing,\n      'v-prompt-backdrop--backdrop': obs.showBackdrop,\n      'v-prompt-backdrop--hidden': !obs.visible,\n      'v-prompt-backdrop--appearing': obs.appearing,\n      'v-prompt-backdrop--disappearing': obs.disappearing,\n    }\"\n  >\n    <ng-container\n      *ngTemplateOutlet=\"modal; context: {appearing: obs.appearing, disappearing: obs.disappearing}\"\n    ></ng-container>\n  </div>\n</ng-container>\n\n<ng-template #modal let-appearing=\"appearing\" let-disappearing=\"disappearing\">\n  <div class=\"v-prompt\" [style.max-width.px]=\"maxWidthPx\">\n    <ng-container\n      *ngTemplateOutlet=\"modalHeader; context: {appearing: appearing, disappearing: disappearing}\"\n    ></ng-container>\n    <ng-container *ngTemplateOutlet=\"modalContent\"></ng-container>\n    <ng-container\n      *ngTemplateOutlet=\"modalFooter; context: {appearing: appearing, disappearing: disappearing}\"\n    ></ng-container>\n  </div>\n</ng-template>\n\n<ng-template #modalHeader let-appearing=\"appearing\" let-disappearing=\"disappearing\">\n  <div class=\"v-prompt__header\">\n    <h4>{{ headerText$ | async }}</h4>\n  </div>\n  <div class=\"v-prompt__close\" *ngIf=\"closeButtonVisible$ | async\">\n    <button type=\"button\" class=\"close\" aria-label=\"Close\" (click)=\"close()\">\n      <span aria-hidden=\"true\">&times;</span>\n    </button>\n  </div>\n</ng-template>\n\n<ng-template #modalContent>\n  <div class=\"v-prompt__content\">\n    <v-paragraph>{{ bodyText$ | async }}</v-paragraph>\n  </div>\n</ng-template>\n\n<ng-template #modalFooter let-appearing=\"appearing\" let-disappearing=\"disappearing\">\n  <div class=\"v-prompt__footer\">\n    <div class=\"v-prompt__buttons\">\n      <button cdsButton=\"primary\" [disabled]=\"appearing || disappearing\" (click)=\"cancel()\">\n        {{ cancelText$ | async }}\n      </button>\n\n      <button cdsButton=\"secondary\" [disabled]=\"appearing || disappearing\" (click)=\"confirm()\">\n        {{ confirmText$ | async }}\n      </button>\n    </div>\n  </div>\n</ng-template>\n", styles: [".v-prompt-backdrop{position:fixed;top:0;left:0;width:100%;height:100%;z-index:var(--v-prompt-z-index);background-color:var(--v-color-backdrop-transparant);backdrop-filter:blur(0);transition:var(--v-prompt-backdrop-transition);display:none;cursor:var(--v-prompt-backdrop-cursor);padding-inline-start:var(--v-prompt-backdrop-padding-inline);padding-inline-end:var(--v-prompt-backdrop-padding-inline);padding-block-start:var(--v-prompt-backdrop-padding-block);padding-block-end:var(--v-prompt-backdrop-padding-block)}.v-prompt-backdrop--visible,.v-prompt-backdrop--disappearing{display:flex;align-items:center;justify-content:center}.v-prompt{background-color:var(--v-prompt-background-color);min-height:var(--v-prompt-min-height);max-height:100%;width:100%;max-width:var(--v-prompt-max-width);transform:translateY(-100%);opacity:0;transition:var(--v-prompt-transition);cursor:var(--v-prompt-cursor);border-radius:var(--v-prompt-border-radius);overflow:hidden;display:flex;flex-direction:column;justify-content:space-between;box-shadow:var(--v-prompt-box-shadow)}.v-prompt-backdrop--backdrop{background-color:var(--v-prompt-backdrop-color);backdrop-filter:var(--v-prompt-backdrop-filter)}.v-prompt-backdrop--backdrop .v-prompt{transform:translateY(0);opacity:1}.v-prompt-backdrop--backdrop.v-prompt-backdrop--mouse-on-backdrop:not(.v-prompt-backdrop--disappearing),.v-prompt-backdrop--backdrop.v-prompt-backdrop--mouse-on-backdrop:not(.v-prompt-backdrop--appearing),.v-prompt-backdrop--backdrop.v-prompt-backdrop--mouse-on-backdrop:hover{background-color:var(--v-prompt-backdrop-color-hover);backdrop-filter:var(--v-prompt-backdrop-filter-hover)}.v-prompt-backdrop--hidden,.v-prompt-backdrop--appearing{cursor:var(--v-prompt-backdrop-cursor-disappearing)}.v-prompt__header{position:relative;display:flex;flex-direction:row;justify-content:center;align-items:center;flex-shrink:0;background-color:var(--v-prompt-header-bg-color);padding-block-start:var(--v-prompt-header-padding-block);padding-block-end:var(--v-prompt-header-padding-block);padding-inline-start:var(--v-prompt-padding-inline);padding-inline-end:var(--v-prompt-padding-inline);border-bottom:var(--v-prompt-header-border);min-height:var(--v-prompt-header-min-height);box-sizing:content-box}.v-prompt__close{position:absolute;top:0;right:0;padding-block-start:var(--v-prompt-border-radius);padding-block-end:var(--v-prompt-border-radius);padding-inline-start:var(--v-prompt-padding-inline);padding-inline-end:var(--v-prompt-padding-inline)}.v-prompt__footer{display:flex;flex-shrink:0;background-color:var(--v-prompt-footer-bg-color);padding-block-start:var(--v-prompt-footer-padding-block);padding-block-end:var(--v-prompt-footer-padding-block);padding-inline-start:var(--v-prompt-padding-inline);padding-inline-end:var(--v-prompt-padding-inline);border-top:var(--v-prompt-footer-border)}.v-prompt__content{height:100%;padding-block-start:var(--v-prompt-content-padding-block-start);padding-block-end:var(--v-prompt-content-padding-block-end);padding-inline-start:var(--v-prompt-padding-inline);padding-inline-end:var(--v-prompt-padding-inline);overflow:auto}.v-prompt__buttons{display:flex;flex-direction:row;width:100%;justify-content:space-between}\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.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1$4.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i2$3.Button, selector: "[cdsButton], [ibmButton]", inputs: ["ibmButton", "cdsButton", "size", "skeleton", "iconOnly", "isExpressive"] }, { kind: "component", type: ParagraphComponent, selector: "v-paragraph", inputs: ["center", "fullWidth", "margin", "italic", "loading", "dataTestId"] }, { kind: "pipe", type: i1$4.AsyncPipe, name: "async" }] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.20", ngImport: i0, type: PromptComponent, decorators: [{
             type: Component,
@@ -16381,7 +16554,7 @@ class CaseTagsSelectorComponent {
         });
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.20", ngImport: i0, type: CaseTagsSelectorComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.20", type: CaseTagsSelectorComponent, isStandalone: true, selector: "valtimo-case-tags-selector", inputs: { caseTags: "caseTags", selectedCaseTagKeys: "selectedCaseTagKeys", carbonTheme: "carbonTheme", disabled: "disabled" }, outputs: { selectedCaseTagsChangeEvent: "selectedCaseTagsChangeEvent" }, 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-label class=\"case-tag-selector\" *ngIf=\"listItems$ | async as listItems\">\n  {{ 'caseManagement.caseTags.searchFieldTitle' | translate }}\n\n  <cds-dropdown\n    [appendInline]=\"false\"\n    type=\"multi\"\n    [disabled]=\"disabled\"\n    selectionFeedback=\"fixed\"\n    (selected)=\"itemSelected($event)\"\n  >\n    <cds-dropdown-list\n      [items]=\"listItems\"\n      [listTpl]=\"colorDropdownItemTemplate\"\n    ></cds-dropdown-list>\n  </cds-dropdown>\n</cds-label>\n\n<ng-template #colorDropdownItemTemplate let-item=\"item\">\n  <div class=\"case-tag-selector-dropdown-template\">\n    <cds-checkbox [checked]=\"item.selected\"></cds-checkbox>\n\n    <cds-tag class=\"cds-tag--no-margin\" [type]=\"item?.tagType\">\n      {{ item?.content }}\n    </cds-tag>\n  </div>\n</ng-template>\n", styles: ["::ng-deep .case-tag-selector .cds--label{width:100%;margin-bottom:0!important}::ng-deep .case-tag-selector .cds--multiselect{margin-top:8px}::ng-deep .case-tag-selector .cds--list-box__selection--multi{pointer-events:none}::ng-deep .case-tag-selector .cds--list-box__selection--multi svg{pointer-events:auto}::ng-deep .case-tag-selector-dropdown-template{display:flex;margin-top:-4px}::ng-deep .case-tag-selector-dropdown-template .cds--tag{margin:0}::ng-deep .case-tag-selector-dropdown-template .generic-span{display:flex;align-items: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: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$4.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "pipe", type: i1$4.AsyncPipe, name: "async" }, { kind: "ngmodule", type: DropdownModule }, { kind: "component", type: i2$2.Dropdown, selector: "cds-dropdown, ibm-dropdown", inputs: ["id", "label", "hideLabel", "helperText", "placeholder", "displayValue", "clearText", "size", "type", "theme", "disabled", "readonly", "skeleton", "inline", "disableArrowKeys", "invalid", "invalidText", "warn", "warnText", "appendInline", "scrollableContainer", "itemValueKey", "selectionFeedback", "menuButtonLabel", "selectedLabel", "dropUp", "fluid"], outputs: ["selected", "onClose", "close"] }, { kind: "component", type: i2$2.DropdownList, selector: "cds-dropdown-list, ibm-dropdown-list", inputs: ["ariaLabel", "items", "listTpl", "type", "showTitles"], outputs: ["select", "scroll", "blurIntent"] }, { kind: "ngmodule", type: CheckboxModule }, { kind: "component", type: i2$2.Checkbox, selector: "cds-checkbox, ibm-checkbox", inputs: ["disabled", "skeleton", "hideLabel", "name", "id", "required", "value", "ariaLabel", "ariaLabelledby", "indeterminate", "checked"], outputs: ["click", "checkedChange", "indeterminateChange"] }, { kind: "ngmodule", type: InputModule$1 }, { kind: "component", type: i2$2.Label, selector: "cds-label, ibm-label", inputs: ["labelInputID", "disabled", "skeleton", "helperText", "invalidText", "invalid", "warn", "warnText", "ariaLabel"] }, { kind: "ngmodule", type: TranslateModule }, { kind: "pipe", type: i1.TranslatePipe, name: "translate" }, { kind: "ngmodule", type: TagModule }, { kind: "component", type: i2$2.Tag, selector: "cds-tag, ibm-tag", inputs: ["type", "size", "class", "skeleton"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.20", type: CaseTagsSelectorComponent, isStandalone: true, selector: "valtimo-case-tags-selector", inputs: { caseTags: "caseTags", selectedCaseTagKeys: "selectedCaseTagKeys", carbonTheme: "carbonTheme", disabled: "disabled" }, outputs: { selectedCaseTagsChangeEvent: "selectedCaseTagsChangeEvent" }, 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-label class=\"case-tag-selector\" *ngIf=\"listItems$ | async as listItems\">\n  {{ 'caseManagement.caseTags.searchFieldTitle' | translate }}\n\n  <cds-dropdown\n    [appendInline]=\"false\"\n    type=\"multi\"\n    [disabled]=\"disabled\"\n    selectionFeedback=\"fixed\"\n    (selected)=\"itemSelected($event)\"\n  >\n    <cds-dropdown-list\n      [items]=\"listItems\"\n      [listTpl]=\"colorDropdownItemTemplate\"\n    ></cds-dropdown-list>\n  </cds-dropdown>\n</cds-label>\n\n<ng-template #colorDropdownItemTemplate let-item=\"item\">\n  <div class=\"case-tag-selector-dropdown-template\">\n    <cds-checkbox [checked]=\"item.selected\"></cds-checkbox>\n\n    <cds-tag class=\"cds-tag--no-margin\" [type]=\"item?.tagType\">\n      {{ item?.content }}\n    </cds-tag>\n  </div>\n</ng-template>\n", styles: ["::ng-deep .case-tag-selector .cds--label{width:100%;margin-bottom:0!important}::ng-deep .case-tag-selector .cds--multiselect{margin-top:8px}::ng-deep .case-tag-selector .cds--list-box__selection--multi{pointer-events:none}::ng-deep .case-tag-selector .cds--list-box__selection--multi svg{pointer-events:auto}::ng-deep .case-tag-selector-dropdown-template{display:flex;margin-top:-4px}::ng-deep .case-tag-selector-dropdown-template .cds--tag{margin:0}::ng-deep .case-tag-selector-dropdown-template .generic-span{display:flex;align-items: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: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$4.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "pipe", type: i1$4.AsyncPipe, name: "async" }, { kind: "ngmodule", type: DropdownModule }, { kind: "component", type: i2$3.Dropdown, selector: "cds-dropdown, ibm-dropdown", inputs: ["id", "label", "hideLabel", "helperText", "placeholder", "displayValue", "clearText", "size", "type", "theme", "disabled", "readonly", "skeleton", "inline", "disableArrowKeys", "invalid", "invalidText", "warn", "warnText", "appendInline", "scrollableContainer", "itemValueKey", "selectionFeedback", "menuButtonLabel", "selectedLabel", "dropUp", "fluid"], outputs: ["selected", "onClose", "close"] }, { kind: "component", type: i2$3.DropdownList, selector: "cds-dropdown-list, ibm-dropdown-list", inputs: ["ariaLabel", "items", "listTpl", "type", "showTitles"], outputs: ["select", "scroll", "blurIntent"] }, { kind: "ngmodule", type: CheckboxModule }, { kind: "component", type: i2$3.Checkbox, selector: "cds-checkbox, ibm-checkbox", inputs: ["disabled", "skeleton", "hideLabel", "name", "id", "required", "value", "ariaLabel", "ariaLabelledby", "indeterminate", "checked"], outputs: ["click", "checkedChange", "indeterminateChange"] }, { kind: "ngmodule", type: InputModule$1 }, { kind: "component", type: i2$3.Label, selector: "cds-label, ibm-label", inputs: ["labelInputID", "disabled", "skeleton", "helperText", "invalidText", "invalid", "warn", "warnText", "ariaLabel"] }, { kind: "ngmodule", type: TranslateModule }, { kind: "pipe", type: i1.TranslatePipe, name: "translate" }, { kind: "ngmodule", type: TagModule }, { kind: "component", type: i2$3.Tag, selector: "cds-tag, ibm-tag", inputs: ["type", "size", "class", "skeleton"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.20", ngImport: i0, type: CaseTagsSelectorComponent, decorators: [{
             type: Component,
@@ -16534,8 +16707,8 @@ class JsonEditorComponent {
         this._changesToSave = null;
         this.isEditActive.set(false);
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.20", ngImport: i0, type: JsonEditorComponent, deps: [{ token: i2$2.IconService }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.20", type: JsonEditorComponent, isStandalone: true, selector: "valtimo-json-editor", inputs: { disabled: "disabled", model: "model", editorOptions: "editorOptions", fitPage: "fitPage", fitPageSpaceAdjustment: "fitPageSpaceAdjustment", formatOnLoad: "formatOnLoad", heightPx: "heightPx", heightStyle: "heightStyle", jsonSchema: "jsonSchema", showEditButton: "showEditButton", widthPx: "widthPx" }, outputs: { changeEvent: "changeEvent", discardEvent: "discardEvent", keepEditingEvent: "keepEditingEvent", saveEvent: "saveEvent" }, 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 class=\"cds--toolbar-content\">\n  @if (isEditActive()) {\n    <button cdsButton=\"secondary\" (click)=\"onCancelClick()\" [attr.data-test-id]=\"testIds.cancelButton\">\n      {{ 'interface.cancel' | translate }}\n\n      <svg cdsIcon=\"close\" size=\"16\" class=\"cds--btn__icon\"></svg>\n    </button>\n\n    <button\n      cdsButton=\"primary\"\n      [disabled]=\"!isValidJson()\"\n      (click)=\"onSaveClick()\"\n      [attr.data-test-id]=\"testIds.saveButton\"\n    >\n      {{ 'interface.save' | translate }}\n\n      <svg cdsIcon=\"save\" size=\"16\" class=\"cds--btn__icon\"></svg>\n    </button>\n  } @else {\n    <ng-content></ng-content>\n\n    <button\n      *ngIf=\"showEditButton\"\n      cdsButton=\"primary\"\n      [disabled]=\"disableEditButton\"\n      (click)=\"onEditClick()\"\n      [attr.data-test-id]=\"testIds.editButton\"\n    >\n      {{ 'interface.edit' | translate }}\n\n      <svg cdsIcon=\"edit\" size=\"16\" class=\"cds--btn__icon\"></svg>\n    </button>\n  }\n</div>\n\n<valtimo-editor\n  [disabled]=\"isDisabled()\"\n  [fitPage]=\"fitPage\"\n  [fitPageSpaceAdjustment]=\"fitPageSpaceAdjustment\"\n  [formatOnLoad]=\"formatOnLoad\"\n  [heightPx]=\"heightPx\"\n  [heightStyle]=\"heightStyle\"\n  [jsonSchema]=\"jsonSchema\"\n  [model]=\"model\"\n  [widthPx]=\"widthPx\"\n  (validEvent)=\"onValidEvent($event)\"\n  (valueChangeEvent)=\"onValueChangeEvent($event)\"\n>\n</valtimo-editor>\n\n<valtimo-confirmation-modal\n  [showModalSubject$]=\"showSaveConfirmationModal$\"\n  cancelButtonTextTranslationKey=\"interface.cancel\"\n  confirmButtonTextTranslationKey=\"interface.save\"\n  contentTranslationKey=\"interface.jsonEditor.saveModalContent\"\n  titleTranslationKey=\"interface.save\"\n  (cancelEvent)=\"onKeepEditingDefinition()\"\n  (confirmEvent)=\"onSaveChanges()\"\n  [attr.data-test-id]=\"testIds.saveConfirmationModal\"\n></valtimo-confirmation-modal>\n\n<valtimo-confirmation-modal\n  [showModalSubject$]=\"showCancelConfirmationModal$\"\n  cancelButtonTextTranslationKey=\"interface.pendingChanges.keepEditing\"\n  cancelButtonType=\"ghost\"\n  confirmButtonTextTranslationKey=\"interface.discard\"\n  confirmButtonType=\"danger\"\n  contentTranslationKey=\"interface.jsonEditor.cancelModal.content\"\n  optionalButtonTextTranslationKey=\"interface.save\"\n  optionalButtonType=\"secondary\"\n  titleTranslationKey=\"interface.jsonEditor.cancelModal.title\"\n  showOptionalButton=\"true\"\n  spacerAfterCancelButton=\"true\"\n  (cancelEvent)=\"onKeepEditingDefinition()\"\n  (confirmEvent)=\"onDiscardChanges()\"\n  (optionalEvent)=\"onSaveChanges()\"\n  [attr.data-test-id]=\"testIds.cancelConfirmationModal\"\n></valtimo-confirmation-modal>\n", styles: [".cds--toolbar-content{background-color:var(--cds-layer)}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$4.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "ngmodule", type: EditorModule }, { kind: "component", type: EditorComponent, selector: "valtimo-editor", inputs: ["editorOptions", "model", "disabled", "formatOnLoad", "widthPx", "heightPx", "heightStyle", "jsonSchema", "fitPage", "fitPageSpaceAdjustment"], outputs: ["validEvent", "valueChangeEvent"] }, { kind: "ngmodule", type: ButtonModule }, { kind: "directive", type: i2$2.Button, selector: "[cdsButton], [ibmButton]", inputs: ["ibmButton", "cdsButton", "size", "skeleton", "iconOnly", "isExpressive"] }, { kind: "ngmodule", type: IconModule }, { kind: "directive", type: i2$2.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: ConfirmationModalModule }, { kind: "component", type: ConfirmationModalComponent, selector: "valtimo-confirmation-modal", inputs: ["titleTranslationKey", "title", "content", "contentTranslationKey", "confirmButtonText", "confirmButtonTextTranslationKey", "confirmButtonType", "showOptionalButton", "optionalButtonText", "optionalButtonTextTranslationKey", "optionalButtonType", "cancelButtonText", "cancelButtonTextTranslationKey", "cancelButtonType", "showModalSubject$", "outputOnConfirm", "outputOnOptional", "spacerAfterCancelButton"], outputs: ["confirmEvent", "optionalEvent", "cancelEvent"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.20", ngImport: i0, type: JsonEditorComponent, deps: [{ token: i2$3.IconService }], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.20", type: JsonEditorComponent, isStandalone: true, selector: "valtimo-json-editor", inputs: { disabled: "disabled", model: "model", editorOptions: "editorOptions", fitPage: "fitPage", fitPageSpaceAdjustment: "fitPageSpaceAdjustment", formatOnLoad: "formatOnLoad", heightPx: "heightPx", heightStyle: "heightStyle", jsonSchema: "jsonSchema", showEditButton: "showEditButton", widthPx: "widthPx" }, outputs: { changeEvent: "changeEvent", discardEvent: "discardEvent", keepEditingEvent: "keepEditingEvent", saveEvent: "saveEvent" }, 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 class=\"cds--toolbar-content\">\n  @if (isEditActive()) {\n    <button cdsButton=\"secondary\" (click)=\"onCancelClick()\" [attr.data-test-id]=\"testIds.cancelButton\">\n      {{ 'interface.cancel' | translate }}\n\n      <svg cdsIcon=\"close\" size=\"16\" class=\"cds--btn__icon\"></svg>\n    </button>\n\n    <button\n      cdsButton=\"primary\"\n      [disabled]=\"!isValidJson()\"\n      (click)=\"onSaveClick()\"\n      [attr.data-test-id]=\"testIds.saveButton\"\n    >\n      {{ 'interface.save' | translate }}\n\n      <svg cdsIcon=\"save\" size=\"16\" class=\"cds--btn__icon\"></svg>\n    </button>\n  } @else {\n    <ng-content></ng-content>\n\n    <button\n      *ngIf=\"showEditButton\"\n      cdsButton=\"primary\"\n      [disabled]=\"disableEditButton\"\n      (click)=\"onEditClick()\"\n      [attr.data-test-id]=\"testIds.editButton\"\n    >\n      {{ 'interface.edit' | translate }}\n\n      <svg cdsIcon=\"edit\" size=\"16\" class=\"cds--btn__icon\"></svg>\n    </button>\n  }\n</div>\n\n<valtimo-editor\n  [disabled]=\"isDisabled()\"\n  [fitPage]=\"fitPage\"\n  [fitPageSpaceAdjustment]=\"fitPageSpaceAdjustment\"\n  [formatOnLoad]=\"formatOnLoad\"\n  [heightPx]=\"heightPx\"\n  [heightStyle]=\"heightStyle\"\n  [jsonSchema]=\"jsonSchema\"\n  [model]=\"model\"\n  [widthPx]=\"widthPx\"\n  (validEvent)=\"onValidEvent($event)\"\n  (valueChangeEvent)=\"onValueChangeEvent($event)\"\n>\n</valtimo-editor>\n\n<valtimo-confirmation-modal\n  [showModalSubject$]=\"showSaveConfirmationModal$\"\n  cancelButtonTextTranslationKey=\"interface.cancel\"\n  confirmButtonTextTranslationKey=\"interface.save\"\n  contentTranslationKey=\"interface.jsonEditor.saveModalContent\"\n  titleTranslationKey=\"interface.save\"\n  (cancelEvent)=\"onKeepEditingDefinition()\"\n  (confirmEvent)=\"onSaveChanges()\"\n  [attr.data-test-id]=\"testIds.saveConfirmationModal\"\n></valtimo-confirmation-modal>\n\n<valtimo-confirmation-modal\n  [showModalSubject$]=\"showCancelConfirmationModal$\"\n  cancelButtonTextTranslationKey=\"interface.pendingChanges.keepEditing\"\n  cancelButtonType=\"ghost\"\n  confirmButtonTextTranslationKey=\"interface.discard\"\n  confirmButtonType=\"danger\"\n  contentTranslationKey=\"interface.jsonEditor.cancelModal.content\"\n  optionalButtonTextTranslationKey=\"interface.save\"\n  optionalButtonType=\"secondary\"\n  titleTranslationKey=\"interface.jsonEditor.cancelModal.title\"\n  showOptionalButton=\"true\"\n  spacerAfterCancelButton=\"true\"\n  (cancelEvent)=\"onKeepEditingDefinition()\"\n  (confirmEvent)=\"onDiscardChanges()\"\n  (optionalEvent)=\"onSaveChanges()\"\n  [attr.data-test-id]=\"testIds.cancelConfirmationModal\"\n></valtimo-confirmation-modal>\n", styles: [".cds--toolbar-content{background-color:var(--cds-layer)}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$4.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "ngmodule", type: EditorModule }, { kind: "component", type: EditorComponent, selector: "valtimo-editor", inputs: ["editorOptions", "model", "disabled", "formatOnLoad", "widthPx", "heightPx", "heightStyle", "jsonSchema", "fitPage", "fitPageSpaceAdjustment"], outputs: ["validEvent", "valueChangeEvent"] }, { 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: ConfirmationModalModule }, { kind: "component", type: ConfirmationModalComponent, selector: "valtimo-confirmation-modal", inputs: ["titleTranslationKey", "title", "content", "contentTranslationKey", "confirmButtonText", "confirmButtonTextTranslationKey", "confirmButtonType", "showOptionalButton", "optionalButtonText", "optionalButtonTextTranslationKey", "optionalButtonType", "cancelButtonText", "cancelButtonTextTranslationKey", "cancelButtonType", "showModalSubject$", "outputOnConfirm", "outputOnOptional", "spacerAfterCancelButton"], outputs: ["confirmEvent", "optionalEvent", "cancelEvent"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.20", ngImport: i0, type: JsonEditorComponent, decorators: [{
             type: Component,
@@ -16547,7 +16720,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.20", ngImpo
                         TranslateModule,
                         ConfirmationModalModule,
                     ], 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 class=\"cds--toolbar-content\">\n  @if (isEditActive()) {\n    <button cdsButton=\"secondary\" (click)=\"onCancelClick()\" [attr.data-test-id]=\"testIds.cancelButton\">\n      {{ 'interface.cancel' | translate }}\n\n      <svg cdsIcon=\"close\" size=\"16\" class=\"cds--btn__icon\"></svg>\n    </button>\n\n    <button\n      cdsButton=\"primary\"\n      [disabled]=\"!isValidJson()\"\n      (click)=\"onSaveClick()\"\n      [attr.data-test-id]=\"testIds.saveButton\"\n    >\n      {{ 'interface.save' | translate }}\n\n      <svg cdsIcon=\"save\" size=\"16\" class=\"cds--btn__icon\"></svg>\n    </button>\n  } @else {\n    <ng-content></ng-content>\n\n    <button\n      *ngIf=\"showEditButton\"\n      cdsButton=\"primary\"\n      [disabled]=\"disableEditButton\"\n      (click)=\"onEditClick()\"\n      [attr.data-test-id]=\"testIds.editButton\"\n    >\n      {{ 'interface.edit' | translate }}\n\n      <svg cdsIcon=\"edit\" size=\"16\" class=\"cds--btn__icon\"></svg>\n    </button>\n  }\n</div>\n\n<valtimo-editor\n  [disabled]=\"isDisabled()\"\n  [fitPage]=\"fitPage\"\n  [fitPageSpaceAdjustment]=\"fitPageSpaceAdjustment\"\n  [formatOnLoad]=\"formatOnLoad\"\n  [heightPx]=\"heightPx\"\n  [heightStyle]=\"heightStyle\"\n  [jsonSchema]=\"jsonSchema\"\n  [model]=\"model\"\n  [widthPx]=\"widthPx\"\n  (validEvent)=\"onValidEvent($event)\"\n  (valueChangeEvent)=\"onValueChangeEvent($event)\"\n>\n</valtimo-editor>\n\n<valtimo-confirmation-modal\n  [showModalSubject$]=\"showSaveConfirmationModal$\"\n  cancelButtonTextTranslationKey=\"interface.cancel\"\n  confirmButtonTextTranslationKey=\"interface.save\"\n  contentTranslationKey=\"interface.jsonEditor.saveModalContent\"\n  titleTranslationKey=\"interface.save\"\n  (cancelEvent)=\"onKeepEditingDefinition()\"\n  (confirmEvent)=\"onSaveChanges()\"\n  [attr.data-test-id]=\"testIds.saveConfirmationModal\"\n></valtimo-confirmation-modal>\n\n<valtimo-confirmation-modal\n  [showModalSubject$]=\"showCancelConfirmationModal$\"\n  cancelButtonTextTranslationKey=\"interface.pendingChanges.keepEditing\"\n  cancelButtonType=\"ghost\"\n  confirmButtonTextTranslationKey=\"interface.discard\"\n  confirmButtonType=\"danger\"\n  contentTranslationKey=\"interface.jsonEditor.cancelModal.content\"\n  optionalButtonTextTranslationKey=\"interface.save\"\n  optionalButtonType=\"secondary\"\n  titleTranslationKey=\"interface.jsonEditor.cancelModal.title\"\n  showOptionalButton=\"true\"\n  spacerAfterCancelButton=\"true\"\n  (cancelEvent)=\"onKeepEditingDefinition()\"\n  (confirmEvent)=\"onDiscardChanges()\"\n  (optionalEvent)=\"onSaveChanges()\"\n  [attr.data-test-id]=\"testIds.cancelConfirmationModal\"\n></valtimo-confirmation-modal>\n", styles: [".cds--toolbar-content{background-color:var(--cds-layer)}\n"] }]
-        }], ctorParameters: () => [{ type: i2$2.IconService }], propDecorators: { disabled: [{
+        }], ctorParameters: () => [{ type: i2$3.IconService }], propDecorators: { disabled: [{
                 type: Input
             }], model: [{
                 type: Input
@@ -16712,7 +16885,7 @@ class AutoKeyInputComponent {
         }
         return newKey;
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.20", ngImport: i0, type: AutoKeyInputComponent, deps: [{ token: i2$2.IconService }], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.20", ngImport: i0, type: AutoKeyInputComponent, deps: [{ token: i2$3.IconService }], target: i0.ɵɵFactoryTarget.Component }); }
     static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.20", type: AutoKeyInputComponent, isStandalone: true, selector: "valtimo-auto-key-input", inputs: { labelTranslationKey: "labelTranslationKey", placeholderTranslationKey: "placeholderTranslationKey", mode: "mode", usedKeys: "usedKeys", sourceText: "sourceText" }, providers: [
             {
                 provide: NG_VALUE_ACCESSOR,
@@ -16724,7 +16897,7 @@ class AutoKeyInputComponent {
                 useExisting: forwardRef(() => AutoKeyInputComponent),
                 multi: true,
             },
-        ], usesOnChanges: 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<cds-label\n  *ngIf=\"{\n    mode: mode$ | async,\n    idError: idError$ | async,\n    editingKey: editingKey$ | async,\n  } as obs\"\n  [invalid]=\"!!obs.idError\"\n  [invalidText]=\"obs.idError | translate\"\n>\n  {{ labelTranslationKey | translate }}\n\n  <div class=\"edit-key-input\">\n    <input\n      cdsText\n      type=\"text\"\n      [value]=\"value\"\n      [placeholder]=\"\n        obs.mode === 'add' && !obs.editingKey\n          ? ('caseManagement.statuses.keyAutoGenerated' | translate)\n          : (placeholderTranslationKey | translate)\n      \"\n      [readOnly]=\"!obs.editingKey || obs.mode === 'edit'\"\n      [invalid]=\"!!obs.idError\"\n      [attr.data-test-id]=\"testIds.input\"\n      (input)=\"onInputChange($event)\"\n      (blur)=\"onTouched()\"\n    />\n\n    <cds-icon-button\n      *ngIf=\"(obs.mode === 'add' || obs.mode === 'duplicate') && !obs.editingKey\"\n      [disabled]=\"$disabled()\"\n      [attr.data-test-id]=\"testIds.editButton\"\n      (click)=\"enableKeyEditing()\"\n      kind=\"secondary\"\n    >\n      <svg cdsIcon=\"edit\" size=\"16\" class=\"cds--btn__icon\"></svg>\n    </cds-icon-button>\n\n    <cds-icon-button\n      *ngIf=\"obs.mode === 'add' && obs.editingKey\"\n      [disabled]=\"$disabled()\"\n      (click)=\"disableKeyEditing()\"\n      kind=\"secondary\"\n    >\n      <svg cdsIcon=\"close\" size=\"16\" class=\"cds--btn__icon\"></svg>\n    </cds-icon-button>\n  </div>\n</cds-label>\n", styles: [".edit-key-input{display:flex;align-items:center;gap:8px;width:100%}.edit-key-input input[cdsText]{flex:1 1 auto}.edit-key-input cds-icon-button{flex-shrink:0;margin-left:4px}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$4.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "pipe", type: i1$4.AsyncPipe, name: "async" }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "ngmodule", type: TranslateModule }, { kind: "pipe", type: i1.TranslatePipe, name: "translate" }, { kind: "ngmodule", type: InputModule$1 }, { kind: "component", type: i2$2.Label, selector: "cds-label, ibm-label", inputs: ["labelInputID", "disabled", "skeleton", "helperText", "invalidText", "invalid", "warn", "warnText", "ariaLabel"] }, { kind: "directive", type: i2$2.TextInput, selector: "[cdsText], [ibmText]", inputs: ["theme", "size", "invalid", "warn", "skeleton"] }, { kind: "ngmodule", type: ButtonModule }, { kind: "component", type: i2$2.IconButton, selector: "cds-icon-button, ibm-icon-button", inputs: ["buttonNgClass", "buttonAttributes", "buttonId", "kind", "size", "type", "isExpressive", "disabled", "description", "showTooltipWhenDisabled"], outputs: ["click", "focus", "blur", "tooltipClick"] }, { kind: "ngmodule", type: IconModule }, { kind: "directive", type: i2$2.IconDirective, selector: "[cdsIcon], [ibmIcon]", inputs: ["ibmIcon", "cdsIcon", "size", "title", "ariaLabel", "ariaLabelledBy", "ariaHidden", "isFocusable"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+        ], usesOnChanges: 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<cds-label\n  *ngIf=\"{\n    mode: mode$ | async,\n    idError: idError$ | async,\n    editingKey: editingKey$ | async,\n  } as obs\"\n  [invalid]=\"!!obs.idError\"\n  [invalidText]=\"obs.idError | translate\"\n>\n  {{ labelTranslationKey | translate }}\n\n  <div class=\"edit-key-input\">\n    <input\n      cdsText\n      type=\"text\"\n      [value]=\"value\"\n      [placeholder]=\"\n        obs.mode === 'add' && !obs.editingKey\n          ? ('caseManagement.statuses.keyAutoGenerated' | translate)\n          : (placeholderTranslationKey | translate)\n      \"\n      [readOnly]=\"!obs.editingKey || obs.mode === 'edit'\"\n      [invalid]=\"!!obs.idError\"\n      [attr.data-test-id]=\"testIds.input\"\n      (input)=\"onInputChange($event)\"\n      (blur)=\"onTouched()\"\n    />\n\n    <cds-icon-button\n      *ngIf=\"(obs.mode === 'add' || obs.mode === 'duplicate') && !obs.editingKey\"\n      [disabled]=\"$disabled()\"\n      [attr.data-test-id]=\"testIds.editButton\"\n      (click)=\"enableKeyEditing()\"\n      kind=\"secondary\"\n    >\n      <svg cdsIcon=\"edit\" size=\"16\" class=\"cds--btn__icon\"></svg>\n    </cds-icon-button>\n\n    <cds-icon-button\n      *ngIf=\"obs.mode === 'add' && obs.editingKey\"\n      [disabled]=\"$disabled()\"\n      (click)=\"disableKeyEditing()\"\n      kind=\"secondary\"\n    >\n      <svg cdsIcon=\"close\" size=\"16\" class=\"cds--btn__icon\"></svg>\n    </cds-icon-button>\n  </div>\n</cds-label>\n", styles: [".edit-key-input{display:flex;align-items:center;gap:8px;width:100%}.edit-key-input input[cdsText]{flex:1 1 auto}.edit-key-input cds-icon-button{flex-shrink:0;margin-left:4px}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$4.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "pipe", type: i1$4.AsyncPipe, name: "async" }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "ngmodule", type: TranslateModule }, { kind: "pipe", type: i1.TranslatePipe, name: "translate" }, { kind: "ngmodule", type: InputModule$1 }, { kind: "component", type: i2$3.Label, selector: "cds-label, ibm-label", inputs: ["labelInputID", "disabled", "skeleton", "helperText", "invalidText", "invalid", "warn", "warnText", "ariaLabel"] }, { kind: "directive", type: i2$3.TextInput, selector: "[cdsText], [ibmText]", inputs: ["theme", "size", "invalid", "warn", "skeleton"] }, { kind: "ngmodule", type: ButtonModule }, { kind: "component", type: i2$3.IconButton, selector: "cds-icon-button, ibm-icon-button", inputs: ["buttonNgClass", "buttonAttributes", "buttonId", "kind", "size", "type", "isExpressive", "disabled", "description", "showTooltipWhenDisabled"], outputs: ["click", "focus", "blur", "tooltipClick"] }, { kind: "ngmodule", type: IconModule }, { kind: "directive", type: i2$3.IconDirective, selector: "[cdsIcon], [ibmIcon]", inputs: ["ibmIcon", "cdsIcon", "size", "title", "ariaLabel", "ariaLabelledBy", "ariaHidden", "isFocusable"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.20", ngImport: i0, type: AutoKeyInputComponent, decorators: [{
             type: Component,
@@ -16747,7 +16920,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.20", ngImpo
                             multi: true,
                         },
                     ], 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<cds-label\n  *ngIf=\"{\n    mode: mode$ | async,\n    idError: idError$ | async,\n    editingKey: editingKey$ | async,\n  } as obs\"\n  [invalid]=\"!!obs.idError\"\n  [invalidText]=\"obs.idError | translate\"\n>\n  {{ labelTranslationKey | translate }}\n\n  <div class=\"edit-key-input\">\n    <input\n      cdsText\n      type=\"text\"\n      [value]=\"value\"\n      [placeholder]=\"\n        obs.mode === 'add' && !obs.editingKey\n          ? ('caseManagement.statuses.keyAutoGenerated' | translate)\n          : (placeholderTranslationKey | translate)\n      \"\n      [readOnly]=\"!obs.editingKey || obs.mode === 'edit'\"\n      [invalid]=\"!!obs.idError\"\n      [attr.data-test-id]=\"testIds.input\"\n      (input)=\"onInputChange($event)\"\n      (blur)=\"onTouched()\"\n    />\n\n    <cds-icon-button\n      *ngIf=\"(obs.mode === 'add' || obs.mode === 'duplicate') && !obs.editingKey\"\n      [disabled]=\"$disabled()\"\n      [attr.data-test-id]=\"testIds.editButton\"\n      (click)=\"enableKeyEditing()\"\n      kind=\"secondary\"\n    >\n      <svg cdsIcon=\"edit\" size=\"16\" class=\"cds--btn__icon\"></svg>\n    </cds-icon-button>\n\n    <cds-icon-button\n      *ngIf=\"obs.mode === 'add' && obs.editingKey\"\n      [disabled]=\"$disabled()\"\n      (click)=\"disableKeyEditing()\"\n      kind=\"secondary\"\n    >\n      <svg cdsIcon=\"close\" size=\"16\" class=\"cds--btn__icon\"></svg>\n    </cds-icon-button>\n  </div>\n</cds-label>\n", styles: [".edit-key-input{display:flex;align-items:center;gap:8px;width:100%}.edit-key-input input[cdsText]{flex:1 1 auto}.edit-key-input cds-icon-button{flex-shrink:0;margin-left:4px}\n"] }]
-        }], ctorParameters: () => [{ type: i2$2.IconService }], propDecorators: { labelTranslationKey: [{
+        }], ctorParameters: () => [{ type: i2$3.IconService }], propDecorators: { labelTranslationKey: [{
                 type: Input
             }], placeholderTranslationKey: [{
                 type: Input
@@ -16808,8 +16981,8 @@ class ListColumnViewComponent {
         const hiddenColumns = this.$availableFields().flatMap(field => !field.selected ? [{ columnKey: field.key }] : []);
         this.viewUpdateEvent.emit(hiddenColumns);
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.20", ngImport: i0, type: ListColumnViewComponent, deps: [{ token: i2$2.IconService }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.20", type: ListColumnViewComponent, isStandalone: true, selector: "valtimo-list-column-view", inputs: { availableFields: "availableFields", hiddenColumns: "hiddenColumns", disabled: "disabled" }, outputs: { viewUpdateEvent: "viewUpdateEvent" }, 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@if (disabled) {\n  <cds-tooltip [description]=\"'listViewColumns.disabledTooltip' | translate\">\n    <button [disabled]=\"disabled\" iconOnly=\"true\" cdsButton=\"ghost\">\n      <svg cdsIcon=\"view--off\" size=\"16\"></svg>\n    </button>\n  </cds-tooltip>\n} @else {\n  <v-overflow-menu placement=\"bottom\" [closeOnSelect]=\"false\" (openChange)=\"onOpenChange($event)\">\n    <div overflowTrigger>\n      <button iconOnly=\"true\" cdsButton=\"ghost\">\n        <svg cdsIcon=\"view--off\" size=\"16\"></svg>\n      </button>\n\n      <cds-tag type=\"blue\" class=\"valtimo-list-column-view__tag\">\n        {{ $checkedItemsCount() }}/{{ $availableFields().length }}\n      </cds-tag>\n    </div>\n\n    <section overflowPane class=\"valtimo-list-column-view__container\" (click)=\"$event.stopImmediatePropagation()\">\n      <cds-label>{{ 'listViewColumns.label' | translate }}</cds-label>\n\n      <div class=\"valtimo-list-column-view__content\">\n        @for (field of $availableFields(); track field.key) {\n          <cds-checkbox\n            [class.valtimo-list-column-view__checkbox--disabled]=\"\n              field.selected && $checkedItemsCount() === 1\n            \"\n            [disabled]=\"field.selected && $checkedItemsCount() === 1\"\n            [checked]=\"field.selected\"\n            (checkedChange)=\"onCheckedChange($event, field.key)\"\n          >\n            {{ field.label }}\n          </cds-checkbox>\n\n          @if (field.selected && $checkedItemsCount() === 1) {\n            <div class=\"valtimo-list-column-view__warning\">\n              <svg cdsIcon=\"warning--alt--filled\" size=\"16\"></svg>\n\n              {{ 'listViewColumns.warning' | translate }}\n            </div>\n          }\n        }\n      </div>\n    </section>\n  </v-overflow-menu>\n}\n", styles: [".valtimo-list-column-view__icon{display:inline-block;position:relative}.valtimo-list-column-view__container{padding:16px;display:flex;flex-direction:column;gap:16px}.valtimo-list-column-view__tag{position:absolute;left:20px;z-index:2;top:-8px}.valtimo-list-column-view__content{display:flex;flex-direction:column;gap:4px}.valtimo-list-column-view__content ::ng-deep .cds--checkbox-label-text{color:var(--cds-text-primary)}.valtimo-list-column-view__warning{display:flex;gap:8px;margin-left:3px;align-items:center;font-size:12px}.valtimo-list-column-view__warning svg{fill:var(--warning)}.valtimo-list-column-view__warning svg ::ng-deep path[data-icon-path=inner-path]{fill:#000}\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: "ngmodule", type: CommonModule }, { kind: "component", type: OverflowMenuComponent, selector: "v-overflow-menu", inputs: ["open", "placement", "menuWidth", "offsetX", "offsetY", "closeOnSelect", "useHostAsReference", "portalToBody"], outputs: ["openChange"] }, { kind: "ngmodule", type: TagModule }, { kind: "component", type: i2$2.Tag, selector: "cds-tag, ibm-tag", inputs: ["type", "size", "class", "skeleton"] }, { kind: "ngmodule", type: CheckboxModule }, { kind: "component", type: i2$2.Checkbox, selector: "cds-checkbox, ibm-checkbox", inputs: ["disabled", "skeleton", "hideLabel", "name", "id", "required", "value", "ariaLabel", "ariaLabelledby", "indeterminate", "checked"], outputs: ["click", "checkedChange", "indeterminateChange"] }, { kind: "ngmodule", type: ButtonModule }, { kind: "directive", type: i2$2.Button, selector: "[cdsButton], [ibmButton]", inputs: ["ibmButton", "cdsButton", "size", "skeleton", "iconOnly", "isExpressive"] }, { kind: "ngmodule", type: TranslateModule }, { kind: "pipe", type: i1.TranslatePipe, name: "translate" }, { kind: "ngmodule", type: IconModule }, { kind: "directive", type: i2$2.IconDirective, selector: "[cdsIcon], [ibmIcon]", inputs: ["ibmIcon", "cdsIcon", "size", "title", "ariaLabel", "ariaLabelledBy", "ariaHidden", "isFocusable"] }, { kind: "ngmodule", type: InputModule$1 }, { kind: "component", type: i2$2.Label, selector: "cds-label, ibm-label", inputs: ["labelInputID", "disabled", "skeleton", "helperText", "invalidText", "invalid", "warn", "warnText", "ariaLabel"] }, { kind: "ngmodule", type: TooltipModule$1 }, { kind: "component", type: i2$2.Tooltip, selector: "cds-tooltip, ibm-tooltip", inputs: ["id", "enterDelayMs", "leaveDelayMs", "disabled", "description", "templateContext"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.20", ngImport: i0, type: ListColumnViewComponent, deps: [{ token: i2$3.IconService }], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.20", type: ListColumnViewComponent, isStandalone: true, selector: "valtimo-list-column-view", inputs: { availableFields: "availableFields", hiddenColumns: "hiddenColumns", disabled: "disabled" }, outputs: { viewUpdateEvent: "viewUpdateEvent" }, 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@if (disabled) {\n  <cds-tooltip [description]=\"'listViewColumns.disabledTooltip' | translate\">\n    <button [disabled]=\"disabled\" iconOnly=\"true\" cdsButton=\"ghost\">\n      <svg cdsIcon=\"view--off\" size=\"16\"></svg>\n    </button>\n  </cds-tooltip>\n} @else {\n  <v-overflow-menu placement=\"bottom\" [closeOnSelect]=\"false\" (openChange)=\"onOpenChange($event)\">\n    <div overflowTrigger>\n      <button iconOnly=\"true\" cdsButton=\"ghost\">\n        <svg cdsIcon=\"view--off\" size=\"16\"></svg>\n      </button>\n\n      <cds-tag type=\"blue\" class=\"valtimo-list-column-view__tag\">\n        {{ $checkedItemsCount() }}/{{ $availableFields().length }}\n      </cds-tag>\n    </div>\n\n    <section overflowPane class=\"valtimo-list-column-view__container\" (click)=\"$event.stopImmediatePropagation()\">\n      <cds-label>{{ 'listViewColumns.label' | translate }}</cds-label>\n\n      <div class=\"valtimo-list-column-view__content\">\n        @for (field of $availableFields(); track field.key) {\n          <cds-checkbox\n            [class.valtimo-list-column-view__checkbox--disabled]=\"\n              field.selected && $checkedItemsCount() === 1\n            \"\n            [disabled]=\"field.selected && $checkedItemsCount() === 1\"\n            [checked]=\"field.selected\"\n            (checkedChange)=\"onCheckedChange($event, field.key)\"\n          >\n            {{ field.label }}\n          </cds-checkbox>\n\n          @if (field.selected && $checkedItemsCount() === 1) {\n            <div class=\"valtimo-list-column-view__warning\">\n              <svg cdsIcon=\"warning--alt--filled\" size=\"16\"></svg>\n\n              {{ 'listViewColumns.warning' | translate }}\n            </div>\n          }\n        }\n      </div>\n    </section>\n  </v-overflow-menu>\n}\n", styles: [".valtimo-list-column-view__icon{display:inline-block;position:relative}.valtimo-list-column-view__container{padding:16px;display:flex;flex-direction:column;gap:16px}.valtimo-list-column-view__tag{position:absolute;left:20px;z-index:2;top:-8px}.valtimo-list-column-view__content{display:flex;flex-direction:column;gap:4px}.valtimo-list-column-view__content ::ng-deep .cds--checkbox-label-text{color:var(--cds-text-primary)}.valtimo-list-column-view__warning{display:flex;gap:8px;margin-left:3px;align-items:center;font-size:12px}.valtimo-list-column-view__warning svg{fill:var(--warning)}.valtimo-list-column-view__warning svg ::ng-deep path[data-icon-path=inner-path]{fill:#000}\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: "ngmodule", type: CommonModule }, { kind: "component", type: OverflowMenuComponent, selector: "v-overflow-menu", inputs: ["open", "placement", "menuWidth", "offsetX", "offsetY", "closeOnSelect", "useHostAsReference", "portalToBody"], outputs: ["openChange"] }, { kind: "ngmodule", type: TagModule }, { kind: "component", type: i2$3.Tag, selector: "cds-tag, ibm-tag", inputs: ["type", "size", "class", "skeleton"] }, { kind: "ngmodule", type: CheckboxModule }, { kind: "component", type: i2$3.Checkbox, selector: "cds-checkbox, ibm-checkbox", inputs: ["disabled", "skeleton", "hideLabel", "name", "id", "required", "value", "ariaLabel", "ariaLabelledby", "indeterminate", "checked"], outputs: ["click", "checkedChange", "indeterminateChange"] }, { kind: "ngmodule", type: ButtonModule }, { kind: "directive", type: i2$3.Button, selector: "[cdsButton], [ibmButton]", inputs: ["ibmButton", "cdsButton", "size", "skeleton", "iconOnly", "isExpressive"] }, { kind: "ngmodule", type: TranslateModule }, { kind: "pipe", type: i1.TranslatePipe, name: "translate" }, { 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: InputModule$1 }, { kind: "component", type: i2$3.Label, selector: "cds-label, ibm-label", inputs: ["labelInputID", "disabled", "skeleton", "helperText", "invalidText", "invalid", "warn", "warnText", "ariaLabel"] }, { kind: "ngmodule", type: TooltipModule$1 }, { kind: "component", type: i2$3.Tooltip, selector: "cds-tooltip, ibm-tooltip", inputs: ["id", "enterDelayMs", "leaveDelayMs", "disabled", "description", "templateContext"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.20", ngImport: i0, type: ListColumnViewComponent, decorators: [{
             type: Component,
@@ -16824,7 +16997,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.20", ngImpo
                         InputModule$1,
                         TooltipModule$1,
                     ], 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@if (disabled) {\n  <cds-tooltip [description]=\"'listViewColumns.disabledTooltip' | translate\">\n    <button [disabled]=\"disabled\" iconOnly=\"true\" cdsButton=\"ghost\">\n      <svg cdsIcon=\"view--off\" size=\"16\"></svg>\n    </button>\n  </cds-tooltip>\n} @else {\n  <v-overflow-menu placement=\"bottom\" [closeOnSelect]=\"false\" (openChange)=\"onOpenChange($event)\">\n    <div overflowTrigger>\n      <button iconOnly=\"true\" cdsButton=\"ghost\">\n        <svg cdsIcon=\"view--off\" size=\"16\"></svg>\n      </button>\n\n      <cds-tag type=\"blue\" class=\"valtimo-list-column-view__tag\">\n        {{ $checkedItemsCount() }}/{{ $availableFields().length }}\n      </cds-tag>\n    </div>\n\n    <section overflowPane class=\"valtimo-list-column-view__container\" (click)=\"$event.stopImmediatePropagation()\">\n      <cds-label>{{ 'listViewColumns.label' | translate }}</cds-label>\n\n      <div class=\"valtimo-list-column-view__content\">\n        @for (field of $availableFields(); track field.key) {\n          <cds-checkbox\n            [class.valtimo-list-column-view__checkbox--disabled]=\"\n              field.selected && $checkedItemsCount() === 1\n            \"\n            [disabled]=\"field.selected && $checkedItemsCount() === 1\"\n            [checked]=\"field.selected\"\n            (checkedChange)=\"onCheckedChange($event, field.key)\"\n          >\n            {{ field.label }}\n          </cds-checkbox>\n\n          @if (field.selected && $checkedItemsCount() === 1) {\n            <div class=\"valtimo-list-column-view__warning\">\n              <svg cdsIcon=\"warning--alt--filled\" size=\"16\"></svg>\n\n              {{ 'listViewColumns.warning' | translate }}\n            </div>\n          }\n        }\n      </div>\n    </section>\n  </v-overflow-menu>\n}\n", styles: [".valtimo-list-column-view__icon{display:inline-block;position:relative}.valtimo-list-column-view__container{padding:16px;display:flex;flex-direction:column;gap:16px}.valtimo-list-column-view__tag{position:absolute;left:20px;z-index:2;top:-8px}.valtimo-list-column-view__content{display:flex;flex-direction:column;gap:4px}.valtimo-list-column-view__content ::ng-deep .cds--checkbox-label-text{color:var(--cds-text-primary)}.valtimo-list-column-view__warning{display:flex;gap:8px;margin-left:3px;align-items:center;font-size:12px}.valtimo-list-column-view__warning svg{fill:var(--warning)}.valtimo-list-column-view__warning svg ::ng-deep path[data-icon-path=inner-path]{fill:#000}\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: i2$2.IconService }], propDecorators: { availableFields: [{
+        }], ctorParameters: () => [{ type: i2$3.IconService }], propDecorators: { availableFields: [{
                 type: Input
             }], hiddenColumns: [{
                 type: Input
@@ -17022,8 +17195,8 @@ class QuickSearchModalComponent {
             return isOnlyWhitespace ? { whitespace: true } : null;
         };
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.20", ngImport: i0, type: QuickSearchModalComponent, deps: [{ token: i2.FormBuilder }, { token: i2$2.IconService }, { token: QuickSearchStateService }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.20", type: QuickSearchModalComponent, isStandalone: true, selector: "valtimo-quick-search-modal", inputs: { existingItems: "existingItems" }, outputs: { closeEvent: "closeEvent" }, 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-modal\n  valtimoCdsModal\n  [minContentHeight]=\"0\"\n  [open]=\"$modalOpen()\"\n  size=\"sm\"\n  showFooter=\"true\"\n  (close)=\"closeModal()\"\n>\n  <cds-modal-header [showCloseButton]=\"true\" (closeSelect)=\"closeModal()\">\n    <h3 cdsModalHeaderHeading>{{ 'quickSearch.addItem' | translate }}</h3>\n  </cds-modal-header>\n\n  <form cdsModalContent class=\"valtimo-qiuck-search-modal__content\" [formGroup]=\"formGroup\">\n    <cds-text-label>\n      {{ 'interface.title' | translate }}\n\n      <input\n        formControlName=\"title\"\n        cdsText\n        type=\"text\"\n        maxlength=\"50\"\n        [placeholder]=\"'interface.title' | translate\"\n        [attr.modal-primary-focus]=\"true\"\n      />\n    </cds-text-label>\n\n    <div *ngIf=\"$showDuplicateError()\" class=\"valtimo-qiuck-search-modal__error\">\n      <svg cdsIcon=\"warning--filled\" size=\"16\"></svg>\n\n      {{ 'quickSearch.duplicateError' | translate }}\n    </div>\n\n    <cds-inline-notification\n      [notificationObj]=\"{\n        type: 'info',\n        message: 'quickSearch.deleteHelperText' | translate,\n        showClose: false,\n        lowContrast: true,\n      }\"\n    ></cds-inline-notification>\n  </form>\n\n  <cds-modal-footer>\n    <button cdsButton=\"ghost\" (click)=\"closeModal()\">\n      {{ 'interface.cancel' | translate }}\n    </button>\n\n    <button [disabled]=\"formGroup.invalid\" cdsButton=\"primary\" (click)=\"closeModal(true)\">\n      {{ 'interface.save' | translate }}\n    </button>\n  </cds-modal-footer>\n</cds-modal>\n", styles: [".valtimo-qiuck-search-modal__content{display:flex;flex-direction:column;gap:16px}.valtimo-qiuck-search-modal__error{color:#da1e28;fill:#da1e28;display:flex;align-items:center;gap:8px}\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: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$4.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i2.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i2.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i2.MaxLengthValidator, selector: "[maxlength][formControlName],[maxlength][formControl],[maxlength][ngModel]", inputs: ["maxlength"] }, { kind: "directive", type: i2.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i2.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "ngmodule", type: TranslateModule }, { kind: "pipe", type: i1.TranslatePipe, name: "translate" }, { kind: "ngmodule", type: ModalModule$1 }, { kind: "component", type: i2$2.Modal, selector: "cds-modal, ibm-modal", inputs: ["size", "theme", "ariaLabel", "open", "trigger", "hasScrollingContent"], outputs: ["overlaySelected", "close"] }, { kind: "component", type: i2$2.ModalHeader, selector: "cds-modal-header, ibm-modal-header", inputs: ["theme", "closeLabel", "showCloseButton"], outputs: ["closeSelect"] }, { kind: "component", type: i2$2.ModalFooter, selector: "cds-modal-footer, ibm-modal-footer" }, { kind: "directive", type: i2$2.ModalContent, selector: "[cdsModalContent], [ibmModalContent]", inputs: ["hasForm"] }, { kind: "directive", type: i2$2.ModalHeaderHeading, selector: "[cdsModalHeaderHeading], [ibmModalHeaderHeading]" }, { kind: "ngmodule", type: ButtonModule }, { kind: "directive", type: i2$2.Button, selector: "[cdsButton], [ibmButton]", inputs: ["ibmButton", "cdsButton", "size", "skeleton", "iconOnly", "isExpressive"] }, { kind: "directive", type: ValtimoCdsModalDirective, selector: "[valtimoCdsModal]", inputs: ["minContentHeight"] }, { kind: "ngmodule", type: InputModule$1 }, { kind: "component", type: i2$2.TextInputLabelComponent, selector: "cds-text-label, ibm-text-label", inputs: ["labelInputID", "disabled", "skeleton", "labelTemplate", "textInputTemplate", "helperText", "invalidText", "invalid", "warn", "warnText", "ariaLabel", "fluid"] }, { kind: "directive", type: i2$2.TextInput, selector: "[cdsText], [ibmText]", inputs: ["theme", "size", "invalid", "warn", "skeleton"] }, { kind: "ngmodule", type: NotificationModule }, { kind: "component", type: i2$2.Notification, selector: "cds-notification, cds-inline-notification, ibm-notification, ibm-inline-notification", inputs: ["notificationObj"] }, { kind: "ngmodule", type: IconModule }, { kind: "directive", type: i2$2.IconDirective, selector: "[cdsIcon], [ibmIcon]", inputs: ["ibmIcon", "cdsIcon", "size", "title", "ariaLabel", "ariaLabelledBy", "ariaHidden", "isFocusable"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.20", ngImport: i0, type: QuickSearchModalComponent, deps: [{ token: i2.FormBuilder }, { token: i2$3.IconService }, { token: QuickSearchStateService }], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.20", type: QuickSearchModalComponent, isStandalone: true, selector: "valtimo-quick-search-modal", inputs: { existingItems: "existingItems" }, outputs: { closeEvent: "closeEvent" }, 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-modal\n  valtimoCdsModal\n  [minContentHeight]=\"0\"\n  [open]=\"$modalOpen()\"\n  size=\"sm\"\n  showFooter=\"true\"\n  (close)=\"closeModal()\"\n>\n  <cds-modal-header [showCloseButton]=\"true\" (closeSelect)=\"closeModal()\">\n    <h3 cdsModalHeaderHeading>{{ 'quickSearch.addItem' | translate }}</h3>\n  </cds-modal-header>\n\n  <form cdsModalContent class=\"valtimo-qiuck-search-modal__content\" [formGroup]=\"formGroup\">\n    <cds-text-label>\n      {{ 'interface.title' | translate }}\n\n      <input\n        formControlName=\"title\"\n        cdsText\n        type=\"text\"\n        maxlength=\"50\"\n        [placeholder]=\"'interface.title' | translate\"\n        [attr.modal-primary-focus]=\"true\"\n      />\n    </cds-text-label>\n\n    <div *ngIf=\"$showDuplicateError()\" class=\"valtimo-qiuck-search-modal__error\">\n      <svg cdsIcon=\"warning--filled\" size=\"16\"></svg>\n\n      {{ 'quickSearch.duplicateError' | translate }}\n    </div>\n\n    <cds-inline-notification\n      [notificationObj]=\"{\n        type: 'info',\n        message: 'quickSearch.deleteHelperText' | translate,\n        showClose: false,\n        lowContrast: true,\n      }\"\n    ></cds-inline-notification>\n  </form>\n\n  <cds-modal-footer>\n    <button cdsButton=\"ghost\" (click)=\"closeModal()\">\n      {{ 'interface.cancel' | translate }}\n    </button>\n\n    <button [disabled]=\"formGroup.invalid\" cdsButton=\"primary\" (click)=\"closeModal(true)\">\n      {{ 'interface.save' | translate }}\n    </button>\n  </cds-modal-footer>\n</cds-modal>\n", styles: [".valtimo-qiuck-search-modal__content{display:flex;flex-direction:column;gap:16px}.valtimo-qiuck-search-modal__error{color:#da1e28;fill:#da1e28;display:flex;align-items:center;gap:8px}\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: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$4.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i2.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i2.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i2.MaxLengthValidator, selector: "[maxlength][formControlName],[maxlength][formControl],[maxlength][ngModel]", inputs: ["maxlength"] }, { kind: "directive", type: i2.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i2.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "ngmodule", type: TranslateModule }, { kind: "pipe", type: i1.TranslatePipe, name: "translate" }, { kind: "ngmodule", type: ModalModule$1 }, { kind: "component", type: i2$3.Modal, selector: "cds-modal, ibm-modal", inputs: ["size", "theme", "ariaLabel", "open", "trigger", "hasScrollingContent"], outputs: ["overlaySelected", "close"] }, { kind: "component", type: i2$3.ModalHeader, selector: "cds-modal-header, ibm-modal-header", inputs: ["theme", "closeLabel", "showCloseButton"], outputs: ["closeSelect"] }, { kind: "component", type: i2$3.ModalFooter, selector: "cds-modal-footer, ibm-modal-footer" }, { kind: "directive", type: i2$3.ModalContent, selector: "[cdsModalContent], [ibmModalContent]", inputs: ["hasForm"] }, { kind: "directive", type: i2$3.ModalHeaderHeading, selector: "[cdsModalHeaderHeading], [ibmModalHeaderHeading]" }, { kind: "ngmodule", type: ButtonModule }, { kind: "directive", type: i2$3.Button, selector: "[cdsButton], [ibmButton]", inputs: ["ibmButton", "cdsButton", "size", "skeleton", "iconOnly", "isExpressive"] }, { kind: "directive", type: ValtimoCdsModalDirective, selector: "[valtimoCdsModal]", inputs: ["minContentHeight"] }, { kind: "ngmodule", type: InputModule$1 }, { kind: "component", type: i2$3.TextInputLabelComponent, selector: "cds-text-label, ibm-text-label", inputs: ["labelInputID", "disabled", "skeleton", "labelTemplate", "textInputTemplate", "helperText", "invalidText", "invalid", "warn", "warnText", "ariaLabel", "fluid"] }, { kind: "directive", type: i2$3.TextInput, selector: "[cdsText], [ibmText]", inputs: ["theme", "size", "invalid", "warn", "skeleton"] }, { kind: "ngmodule", type: NotificationModule }, { kind: "component", type: i2$3.Notification, selector: "cds-notification, cds-inline-notification, ibm-notification, ibm-inline-notification", inputs: ["notificationObj"] }, { kind: "ngmodule", type: IconModule }, { kind: "directive", type: i2$3.IconDirective, selector: "[cdsIcon], [ibmIcon]", inputs: ["ibmIcon", "cdsIcon", "size", "title", "ariaLabel", "ariaLabelledBy", "ariaHidden", "isFocusable"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.20", ngImport: i0, type: QuickSearchModalComponent, decorators: [{
             type: Component,
@@ -17038,7 +17211,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.20", ngImpo
                         NotificationModule,
                         IconModule,
                     ], 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-modal\n  valtimoCdsModal\n  [minContentHeight]=\"0\"\n  [open]=\"$modalOpen()\"\n  size=\"sm\"\n  showFooter=\"true\"\n  (close)=\"closeModal()\"\n>\n  <cds-modal-header [showCloseButton]=\"true\" (closeSelect)=\"closeModal()\">\n    <h3 cdsModalHeaderHeading>{{ 'quickSearch.addItem' | translate }}</h3>\n  </cds-modal-header>\n\n  <form cdsModalContent class=\"valtimo-qiuck-search-modal__content\" [formGroup]=\"formGroup\">\n    <cds-text-label>\n      {{ 'interface.title' | translate }}\n\n      <input\n        formControlName=\"title\"\n        cdsText\n        type=\"text\"\n        maxlength=\"50\"\n        [placeholder]=\"'interface.title' | translate\"\n        [attr.modal-primary-focus]=\"true\"\n      />\n    </cds-text-label>\n\n    <div *ngIf=\"$showDuplicateError()\" class=\"valtimo-qiuck-search-modal__error\">\n      <svg cdsIcon=\"warning--filled\" size=\"16\"></svg>\n\n      {{ 'quickSearch.duplicateError' | translate }}\n    </div>\n\n    <cds-inline-notification\n      [notificationObj]=\"{\n        type: 'info',\n        message: 'quickSearch.deleteHelperText' | translate,\n        showClose: false,\n        lowContrast: true,\n      }\"\n    ></cds-inline-notification>\n  </form>\n\n  <cds-modal-footer>\n    <button cdsButton=\"ghost\" (click)=\"closeModal()\">\n      {{ 'interface.cancel' | translate }}\n    </button>\n\n    <button [disabled]=\"formGroup.invalid\" cdsButton=\"primary\" (click)=\"closeModal(true)\">\n      {{ 'interface.save' | translate }}\n    </button>\n  </cds-modal-footer>\n</cds-modal>\n", styles: [".valtimo-qiuck-search-modal__content{display:flex;flex-direction:column;gap:16px}.valtimo-qiuck-search-modal__error{color:#da1e28;fill:#da1e28;display:flex;align-items:center;gap:8px}\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: i2.FormBuilder }, { type: i2$2.IconService }, { type: QuickSearchStateService }], propDecorators: { existingItems: [{
+        }], ctorParameters: () => [{ type: i2.FormBuilder }, { type: i2$3.IconService }, { type: QuickSearchStateService }], propDecorators: { existingItems: [{
                 type: Input
             }], closeEvent: [{
                 type: Output
@@ -17101,8 +17274,8 @@ class QuickSearchComponent {
         })
             .subscribe(() => this._refresh$.next(null));
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.20", ngImport: i0, type: QuickSearchComponent, deps: [{ token: i2$2.IconService }, { token: QuickSearchStateService }, { token: QUICK_SEARCH_SERVICE }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.20", type: QuickSearchComponent, isStandalone: true, selector: "valtimo-quick-search", outputs: { quickSearchEvent: "quickSearchEvent" }, 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<ng-container\n  *ngIf=\"{paramsToSave: paramsToSave$ | async, quickSearchItems: quickSearchItems$ | async} as obs\"\n>\n  @for (item of obs.quickSearchItems; track item.title) {\n    <cds-tooltip\n      [description]=\"'quickSearch.rightClickTooltip' | translate\"\n      [enterDelayMs]=\"TOOLTIP_DELAY\"\n    >\n      <cds-tag\n        type=\"blue\"\n        [valtimoContextMenu]=\"contextMenuTpl\"\n        [contextData]=\"item\"\n        (click)=\"onItemClick(item)\"\n      >\n        {{ item.title }}\n      </cds-tag>\n    </cds-tooltip>\n  }\n\n  <valtimo-quick-search-modal\n    [existingItems]=\"obs.quickSearchItems\"\n    (closeEvent)=\"onModalCloseEvent($event, obs.paramsToSave)\"\n  ></valtimo-quick-search-modal>\n\n  <valtimo-confirmation-modal\n    confirmButtonTextTranslationKey=\"interface.delete\"\n    confirmButtonType=\"danger\"\n    contentTranslationKey=\"quickSearch.deleteModalContent\"\n    [outputOnConfirm]=\"$itemToDelete()\"\n    [showModalSubject$]=\"showDeleteModal$\"\n    titleTranslationKey=\"quickSearch.deleteModalTitle\"\n    (confirmEvent)=\"onDeleteConfirm($event)\"\n  ></valtimo-confirmation-modal>\n\n  <ng-template #contextMenuTpl let-data=\"data\" let-close=\"close\">\n    <v-overflow-menu-option (selected)=\"deleteItem(data); close()\">\n      {{ 'interface.delete' | translate }}\n\n      <svg cdsIcon=\"trash-can\" size=\"16\"></svg>\n    </v-overflow-menu-option>\n  </ng-template>\n</ng-container>\n", styles: ["cds-tag{cursor:pointer}cds-overflow-menu-option{background:var(--cds-layer)}\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: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$4.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "pipe", type: i1$4.AsyncPipe, name: "async" }, { kind: "ngmodule", type: TranslateModule }, { kind: "pipe", type: i1.TranslatePipe, name: "translate" }, { kind: "component", type: QuickSearchModalComponent, selector: "valtimo-quick-search-modal", inputs: ["existingItems"], outputs: ["closeEvent"] }, { kind: "ngmodule", type: TagModule }, { kind: "component", type: i2$2.Tag, selector: "cds-tag, ibm-tag", inputs: ["type", "size", "class", "skeleton"] }, { kind: "ngmodule", type: ConfirmationModalModule }, { kind: "component", type: ConfirmationModalComponent, selector: "valtimo-confirmation-modal", inputs: ["titleTranslationKey", "title", "content", "contentTranslationKey", "confirmButtonText", "confirmButtonTextTranslationKey", "confirmButtonType", "showOptionalButton", "optionalButtonText", "optionalButtonTextTranslationKey", "optionalButtonType", "cancelButtonText", "cancelButtonTextTranslationKey", "cancelButtonType", "showModalSubject$", "outputOnConfirm", "outputOnOptional", "spacerAfterCancelButton"], outputs: ["confirmEvent", "optionalEvent", "cancelEvent"] }, { kind: "ngmodule", type: ContextMenuModule }, { kind: "ngmodule", type: IconModule }, { kind: "directive", type: i2$2.IconDirective, selector: "[cdsIcon], [ibmIcon]", inputs: ["ibmIcon", "cdsIcon", "size", "title", "ariaLabel", "ariaLabelledBy", "ariaHidden", "isFocusable"] }, { kind: "directive", type: ContextMenuDirective, selector: "[valtimoContextMenu]", inputs: ["valtimoContextMenu", "contextData", "positions"] }, { kind: "ngmodule", type: TooltipModule$1 }, { kind: "component", type: i2$2.Tooltip, selector: "cds-tooltip, ibm-tooltip", inputs: ["id", "enterDelayMs", "leaveDelayMs", "disabled", "description", "templateContext"] }, { kind: "component", type: OverflowMenuOptionComponent, selector: "v-overflow-menu-option", inputs: ["disabled", "type", "testId", "optionId"], outputs: ["selected"] }] }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.20", ngImport: i0, type: QuickSearchComponent, deps: [{ token: i2$3.IconService }, { token: QuickSearchStateService }, { token: QUICK_SEARCH_SERVICE }], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.20", type: QuickSearchComponent, isStandalone: true, selector: "valtimo-quick-search", outputs: { quickSearchEvent: "quickSearchEvent" }, 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-container\n  *ngIf=\"{paramsToSave: paramsToSave$ | async, quickSearchItems: quickSearchItems$ | async} as obs\"\n>\n  @for (item of obs.quickSearchItems; track item.title) {\n    <cds-tooltip\n      autoAlign=\"true\"\n      align=\"bottom-left\"\n      [description]=\"'quickSearch.rightClickTooltip' | translate\"\n      [enterDelayMs]=\"TOOLTIP_DELAY\"\n    >\n      <cds-tag\n        type=\"blue\"\n        [valtimoContextMenu]=\"contextMenuTpl\"\n        [contextData]=\"item\"\n        (click)=\"onItemClick(item)\"\n      >\n        {{ item.title }}\n      </cds-tag>\n    </cds-tooltip>\n  }\n\n  <valtimo-quick-search-modal\n    [existingItems]=\"obs.quickSearchItems\"\n    (closeEvent)=\"onModalCloseEvent($event, obs.paramsToSave)\"\n  ></valtimo-quick-search-modal>\n\n  <valtimo-confirmation-modal\n    confirmButtonTextTranslationKey=\"interface.delete\"\n    confirmButtonType=\"danger\"\n    contentTranslationKey=\"quickSearch.deleteModalContent\"\n    [outputOnConfirm]=\"$itemToDelete()\"\n    [showModalSubject$]=\"showDeleteModal$\"\n    titleTranslationKey=\"quickSearch.deleteModalTitle\"\n    (confirmEvent)=\"onDeleteConfirm($event)\"\n  ></valtimo-confirmation-modal>\n\n  <ng-template #contextMenuTpl let-data=\"data\" let-close=\"close\">\n    <v-overflow-menu-option (selected)=\"deleteItem(data); close()\">\n      {{ 'interface.delete' | translate }}\n\n      <svg cdsIcon=\"trash-can\" size=\"16\"></svg>\n    </v-overflow-menu-option>\n  </ng-template>\n</ng-container>\n", styles: ["cds-tag{cursor:pointer}cds-overflow-menu-option{background:var(--cds-layer)}\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: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$4.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "pipe", type: i1$4.AsyncPipe, name: "async" }, { kind: "ngmodule", type: TranslateModule }, { kind: "pipe", type: i1.TranslatePipe, name: "translate" }, { kind: "component", type: QuickSearchModalComponent, selector: "valtimo-quick-search-modal", inputs: ["existingItems"], outputs: ["closeEvent"] }, { kind: "ngmodule", type: TagModule }, { kind: "component", type: i2$3.Tag, selector: "cds-tag, ibm-tag", inputs: ["type", "size", "class", "skeleton"] }, { kind: "ngmodule", type: ConfirmationModalModule }, { kind: "component", type: ConfirmationModalComponent, selector: "valtimo-confirmation-modal", inputs: ["titleTranslationKey", "title", "content", "contentTranslationKey", "confirmButtonText", "confirmButtonTextTranslationKey", "confirmButtonType", "showOptionalButton", "optionalButtonText", "optionalButtonTextTranslationKey", "optionalButtonType", "cancelButtonText", "cancelButtonTextTranslationKey", "cancelButtonType", "showModalSubject$", "outputOnConfirm", "outputOnOptional", "spacerAfterCancelButton"], outputs: ["confirmEvent", "optionalEvent", "cancelEvent"] }, { kind: "ngmodule", type: ContextMenuModule }, { kind: "ngmodule", type: IconModule }, { kind: "directive", type: i2$3.IconDirective, selector: "[cdsIcon], [ibmIcon]", inputs: ["ibmIcon", "cdsIcon", "size", "title", "ariaLabel", "ariaLabelledBy", "ariaHidden", "isFocusable"] }, { kind: "directive", type: ContextMenuDirective, selector: "[valtimoContextMenu]", inputs: ["valtimoContextMenu", "contextData", "positions"] }, { kind: "ngmodule", type: TooltipModule$1 }, { kind: "component", type: i2$3.Tooltip, selector: "cds-tooltip, ibm-tooltip", inputs: ["id", "enterDelayMs", "leaveDelayMs", "disabled", "description", "templateContext"] }, { kind: "component", type: OverflowMenuOptionComponent, selector: "v-overflow-menu-option", inputs: ["disabled", "type", "testId", "optionId"], outputs: ["selected"] }] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.20", ngImport: i0, type: QuickSearchComponent, decorators: [{
             type: Component,
@@ -17117,8 +17290,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.20", ngImpo
                         ContextMenuDirective,
                         TooltipModule$1,
                         OverflowMenuOptionComponent,
-                    ], 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<ng-container\n  *ngIf=\"{paramsToSave: paramsToSave$ | async, quickSearchItems: quickSearchItems$ | async} as obs\"\n>\n  @for (item of obs.quickSearchItems; track item.title) {\n    <cds-tooltip\n      [description]=\"'quickSearch.rightClickTooltip' | translate\"\n      [enterDelayMs]=\"TOOLTIP_DELAY\"\n    >\n      <cds-tag\n        type=\"blue\"\n        [valtimoContextMenu]=\"contextMenuTpl\"\n        [contextData]=\"item\"\n        (click)=\"onItemClick(item)\"\n      >\n        {{ item.title }}\n      </cds-tag>\n    </cds-tooltip>\n  }\n\n  <valtimo-quick-search-modal\n    [existingItems]=\"obs.quickSearchItems\"\n    (closeEvent)=\"onModalCloseEvent($event, obs.paramsToSave)\"\n  ></valtimo-quick-search-modal>\n\n  <valtimo-confirmation-modal\n    confirmButtonTextTranslationKey=\"interface.delete\"\n    confirmButtonType=\"danger\"\n    contentTranslationKey=\"quickSearch.deleteModalContent\"\n    [outputOnConfirm]=\"$itemToDelete()\"\n    [showModalSubject$]=\"showDeleteModal$\"\n    titleTranslationKey=\"quickSearch.deleteModalTitle\"\n    (confirmEvent)=\"onDeleteConfirm($event)\"\n  ></valtimo-confirmation-modal>\n\n  <ng-template #contextMenuTpl let-data=\"data\" let-close=\"close\">\n    <v-overflow-menu-option (selected)=\"deleteItem(data); close()\">\n      {{ 'interface.delete' | translate }}\n\n      <svg cdsIcon=\"trash-can\" size=\"16\"></svg>\n    </v-overflow-menu-option>\n  </ng-template>\n</ng-container>\n", styles: ["cds-tag{cursor:pointer}cds-overflow-menu-option{background:var(--cds-layer)}\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: i2$2.IconService }, { type: QuickSearchStateService }, { type: undefined, decorators: [{
+                    ], 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-container\n  *ngIf=\"{paramsToSave: paramsToSave$ | async, quickSearchItems: quickSearchItems$ | async} as obs\"\n>\n  @for (item of obs.quickSearchItems; track item.title) {\n    <cds-tooltip\n      autoAlign=\"true\"\n      align=\"bottom-left\"\n      [description]=\"'quickSearch.rightClickTooltip' | translate\"\n      [enterDelayMs]=\"TOOLTIP_DELAY\"\n    >\n      <cds-tag\n        type=\"blue\"\n        [valtimoContextMenu]=\"contextMenuTpl\"\n        [contextData]=\"item\"\n        (click)=\"onItemClick(item)\"\n      >\n        {{ item.title }}\n      </cds-tag>\n    </cds-tooltip>\n  }\n\n  <valtimo-quick-search-modal\n    [existingItems]=\"obs.quickSearchItems\"\n    (closeEvent)=\"onModalCloseEvent($event, obs.paramsToSave)\"\n  ></valtimo-quick-search-modal>\n\n  <valtimo-confirmation-modal\n    confirmButtonTextTranslationKey=\"interface.delete\"\n    confirmButtonType=\"danger\"\n    contentTranslationKey=\"quickSearch.deleteModalContent\"\n    [outputOnConfirm]=\"$itemToDelete()\"\n    [showModalSubject$]=\"showDeleteModal$\"\n    titleTranslationKey=\"quickSearch.deleteModalTitle\"\n    (confirmEvent)=\"onDeleteConfirm($event)\"\n  ></valtimo-confirmation-modal>\n\n  <ng-template #contextMenuTpl let-data=\"data\" let-close=\"close\">\n    <v-overflow-menu-option (selected)=\"deleteItem(data); close()\">\n      {{ 'interface.delete' | translate }}\n\n      <svg cdsIcon=\"trash-can\" size=\"16\"></svg>\n    </v-overflow-menu-option>\n  </ng-template>\n</ng-container>\n", styles: ["cds-tag{cursor:pointer}cds-overflow-menu-option{background:var(--cds-layer)}\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: i2$3.IconService }, { type: QuickSearchStateService }, { type: undefined, decorators: [{
                     type: Inject,
                     args: [QUICK_SEARCH_SERVICE]
                 }] }], propDecorators: { quickSearchEvent: [{
@@ -17184,7 +17357,7 @@ class MdiIconSelectorComponent {
                 useExisting: forwardRef(() => MdiIconSelectorComponent),
                 multi: 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-text-label>\n  <v-input-label\n    [title]=\"labelTranslationKey | translate\"\n    [tooltip]=\"tooltipTranslationKey | translate\"\n  >\n  </v-input-label>\n\n  <div class=\"mdi-icon-selector\">\n    <span class=\"mdi-icon-preview mdi\" [ngClass]=\"(value$ | async) || 'mdi-minus'\"></span>\n\n    <cds-combo-box\n      [items]=\"(items$ | async) || []\"\n      [placeholder]=\"placeholderTranslationKey | translate\"\n      [disabled]=\"$disabled()\"\n      (selected)=\"onSelected($event)\"\n      [appendInline]=\"appendInline\"\n      [dropUp]=\"dropUp\"\n      (blur)=\"onTouched()\"\n    >\n      <cds-dropdown-list [listTpl]=\"iconListTemplate\"></cds-dropdown-list>\n    </cds-combo-box>\n  </div>\n</cds-text-label>\n\n<ng-template #iconListTemplate let-item=\"item\">\n  <div class=\"mdi-list-item\">\n    <span class=\"mdi\" [ngClass]=\"item.key\" aria-hidden=\"true\"></span>\n\n    <span>{{ item.content }}</span>\n  </div>\n</ng-template>\n", styles: [".mdi-icon-selector{display:flex;align-items:center;gap:8px;width:350px}.mdi-icon-selector cds-combo-box{flex:1 1 auto;min-width:0}.mdi-icon-preview{width:24px;height:24px;display:flex;align-items:center;justify-content:center;font-size:18px}.mdi-list-item{display:flex;flex-direction:row;gap:8px;align-items:center}.mdi-list-item .mdi{font-size:16px}\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: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$4.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "pipe", type: i1$4.AsyncPipe, name: "async" }, { kind: "ngmodule", type: TranslateModule }, { kind: "pipe", type: i1.TranslatePipe, name: "translate" }, { kind: "ngmodule", type: ComboBoxModule }, { kind: "component", type: i2$2.ComboBox, selector: "cds-combo-box, ibm-combo-box", inputs: ["placeholder", "openMenuAria", "closeMenuAria", "clearSelectionsTitle", "clearSelectionsAria", "clearSelectionTitle", "clearSelectionAria", "id", "labelId", "items", "type", "size", "itemValueKey", "label", "hideLabel", "helperText", "appendInline", "invalid", "invalidText", "warn", "warnText", "maxLength", "theme", "selectionFeedback", "autocomplete", "dropUp", "disabled", "readonly", "fluid"], outputs: ["selected", "submit", "close", "search", "clear"] }, { kind: "component", type: i2$2.DropdownList, selector: "cds-dropdown-list, ibm-dropdown-list", inputs: ["ariaLabel", "items", "listTpl", "type", "showTitles"], outputs: ["select", "scroll", "blurIntent"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "ngmodule", type: InputModule$1 }, { kind: "component", type: i2$2.TextInputLabelComponent, selector: "cds-text-label, ibm-text-label", inputs: ["labelInputID", "disabled", "skeleton", "labelTemplate", "textInputTemplate", "helperText", "invalidText", "invalid", "warn", "warnText", "ariaLabel", "fluid"] }, { kind: "ngmodule", type: IconModule }, { kind: "ngmodule", type: TagModule }, { kind: "ngmodule", type: InputLabelModule }, { kind: "component", type: InputLabelComponent, selector: "v-input-label", inputs: ["name", "tooltip", "tooltipTranslationKey", "largeMargin", "small", "noMargin", "title", "titleTranslationKey", "required", "disabled", "carbonTheme"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+        ], 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-text-label>\n  <v-input-label\n    [title]=\"labelTranslationKey | translate\"\n    [tooltip]=\"tooltipTranslationKey | translate\"\n  >\n  </v-input-label>\n\n  <div class=\"mdi-icon-selector\">\n    <span class=\"mdi-icon-preview mdi\" [ngClass]=\"(value$ | async) || 'mdi-minus'\"></span>\n\n    <cds-combo-box\n      [items]=\"(items$ | async) || []\"\n      [placeholder]=\"placeholderTranslationKey | translate\"\n      [disabled]=\"$disabled()\"\n      (selected)=\"onSelected($event)\"\n      [appendInline]=\"appendInline\"\n      [dropUp]=\"dropUp\"\n      (blur)=\"onTouched()\"\n    >\n      <cds-dropdown-list [listTpl]=\"iconListTemplate\"></cds-dropdown-list>\n    </cds-combo-box>\n  </div>\n</cds-text-label>\n\n<ng-template #iconListTemplate let-item=\"item\">\n  <div class=\"mdi-list-item\">\n    <span class=\"mdi\" [ngClass]=\"item.key\" aria-hidden=\"true\"></span>\n\n    <span>{{ item.content }}</span>\n  </div>\n</ng-template>\n", styles: [".mdi-icon-selector{display:flex;align-items:center;gap:8px;width:350px}.mdi-icon-selector cds-combo-box{flex:1 1 auto;min-width:0}.mdi-icon-preview{width:24px;height:24px;display:flex;align-items:center;justify-content:center;font-size:18px}.mdi-list-item{display:flex;flex-direction:row;gap:8px;align-items:center}.mdi-list-item .mdi{font-size:16px}\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: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$4.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "pipe", type: i1$4.AsyncPipe, name: "async" }, { kind: "ngmodule", type: TranslateModule }, { kind: "pipe", type: i1.TranslatePipe, name: "translate" }, { kind: "ngmodule", type: ComboBoxModule }, { kind: "component", type: i2$3.ComboBox, selector: "cds-combo-box, ibm-combo-box", inputs: ["placeholder", "openMenuAria", "closeMenuAria", "clearSelectionsTitle", "clearSelectionsAria", "clearSelectionTitle", "clearSelectionAria", "id", "labelId", "items", "type", "size", "itemValueKey", "label", "hideLabel", "helperText", "appendInline", "invalid", "invalidText", "warn", "warnText", "maxLength", "theme", "selectionFeedback", "autocomplete", "dropUp", "disabled", "readonly", "fluid"], outputs: ["selected", "submit", "close", "search", "clear"] }, { kind: "component", type: i2$3.DropdownList, selector: "cds-dropdown-list, ibm-dropdown-list", inputs: ["ariaLabel", "items", "listTpl", "type", "showTitles"], outputs: ["select", "scroll", "blurIntent"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "ngmodule", type: InputModule$1 }, { kind: "component", type: i2$3.TextInputLabelComponent, selector: "cds-text-label, ibm-text-label", inputs: ["labelInputID", "disabled", "skeleton", "labelTemplate", "textInputTemplate", "helperText", "invalidText", "invalid", "warn", "warnText", "ariaLabel", "fluid"] }, { kind: "ngmodule", type: IconModule }, { kind: "ngmodule", type: TagModule }, { kind: "ngmodule", type: InputLabelModule }, { kind: "component", type: InputLabelComponent, selector: "v-input-label", inputs: ["name", "tooltip", "tooltipTranslationKey", "largeMargin", "small", "noMargin", "title", "titleTranslationKey", "required", "disabled", "carbonTheme"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.20", ngImport: i0, type: MdiIconSelectorComponent, decorators: [{
             type: Component,
@@ -17384,8 +17557,8 @@ class SchemaEditorComponent {
     setRequired(schema) {
         this._required$.next(collectObjectLevels(JSON.parse(schema), true));
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.20", ngImport: i0, type: SchemaEditorComponent, deps: [{ token: i0.NgZone }, { token: i2$2.IconService }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.20", type: SchemaEditorComponent, isStandalone: true, selector: "valtimo-schema-editor", inputs: { schemaJson: "schemaJson", disabled: "disabled" }, outputs: { changeEvent: "changeEvent", saveEvent: "saveEvent", validEvent: "validEvent" }, viewQueries: [{ propertyName: "hostEl", first: true, predicate: ["host"], descendants: true, static: true }], 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  ~\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 class=\"schema-editor\">\n  <div class=\"cds--toolbar-content\">\n    <ng-content></ng-content>\n\n    <button cdsButton=\"ghost\" (click)=\"onRequiredPanelToggle()\">\n      {{ 'schemaEditor.manageRequiredFields' | translate }}\n\n      <svg class=\"cds--btn__icon\" cdsIcon=\"document--requirements\" size=\"16\"></svg>\n    </button>\n\n    <button\n      cdsButton=\"primary\"\n      [disabled]=\"disabled || (valid$ | async) === false\"\n      (click)=\"onSaveClick()\"\n    >\n      {{ 'interface.save' | translate }}\n\n      <svg cdsIcon=\"save\" size=\"16\" class=\"cds--btn__icon\"></svg>\n    </button>\n  </div>\n\n  <div class=\"jse-host-container\">\n    <div [attr.data-carbon-theme]=\"'g10'\" class=\"jse-host\" #host></div>\n\n    <div\n      class=\"requirements-panel\"\n      [ngClass]=\"{'requirements-panel--open': showRequiredPanel$ | async}\"\n    >\n      <ng-container *ngTemplateOutlet=\"requiredPropertiesPanel\"></ng-container>\n    </div>\n  </div>\n</div>\n\n<valtimo-confirmation-modal\n  [showModalSubject$]=\"showSaveConfirmationModal$\"\n  cancelButtonTextTranslationKey=\"interface.cancel\"\n  confirmButtonTextTranslationKey=\"interface.save\"\n  contentTranslationKey=\"interface.jsonEditor.saveModalContent\"\n  titleTranslationKey=\"interface.save\"\n  (cancelEvent)=\"hideConfirmationModal()\"\n  (confirmEvent)=\"onSaveChanges()\"\n>\n</valtimo-confirmation-modal>\n\n<ng-template #requiredPropertiesPanel>\n  <div class=\"schema-editor__required-properties\" (click)=\"$event.stopPropagation()\">\n    <header class=\"cds--modal-header default schema-editor__required-properties-header\">\n      <h5>\n        {{ 'schemaEditor.requiredFields' | translate }}\n      </h5>\n\n      <div class=\"cds--modal-close-button\">\n        <button\n          cdsButton=\"primary\"\n          class=\"cds--modal-close cds--btn--icon-only cds--btn--lg\"\n          type=\"button\"\n          (click)=\"onRequiredPanelToggle()\"\n        >\n          <svg cdsIcon=\"close\" size=\"20\" class=\"cds--modal-close__icon\"></svg>\n        </button>\n      </div>\n    </header>\n\n    <div class=\"schema-editor__required-properties-content\">\n      @for (objectLevel of objectLevels$ | async; track $index) {\n        <div class=\"schema-editor__object-level\">\n          <span class=\"schema-editor__object-level-title\">\n            @if ((objectLevel.path || []).length === 0) {\n              {{ 'schemaEditor.rootObject' | translate }}\n            } @else {\n              @for (pathParth of objectLevel.path; track pathParth; let last = $last) {\n                <span class=\"schema-editor__object-level-title-part\">{{\n                  pathParth + (!last ? ' >' : '')\n                }}</span>\n              }\n            }\n          </span>\n\n          @for (property of objectLevel.properties; track property) {\n            <div class=\"schema-editor__property\">\n              <cds-checkbox\n                [disabled]=\"disabled\"\n                [checked]=\"isRequired$(objectLevel.path, property) | async\"\n                (checkedChange)=\"onRequiredPropertyChange(objectLevel.path, property, $event)\"\n              >\n                {{ property }}\n              </cds-checkbox>\n            </div>\n          }\n        </div>\n      }\n    </div>\n  </div>\n</ng-template>\n", styles: [".jse-host,.jse-host-container,:host{display:block;width:100%;height:100%}.jse-host-container{position:relative;overflow:hidden}.requirements-panel{position:absolute;top:0;right:0;width:350px;height:100%;outline:1px solid var(--cds-border-subtle);outline-offset:-1px;transform:translate(350px);transition:transform .24s cubic-bezier(0,0,.3,1)}.requirements-panel--open{transform:translate(0)}.schema-editor,.schema-editor__required-properties{display:flex;flex-direction:column;width:100%;height:100%;background:var(--cds-layer)}.schema-editor__required-properties-header{margin:1px;padding-top:12px;padding-bottom:12px;border-bottom:1px solid var(--cds-border-subtle)}.schema-editor__required-properties-content{width:100%;height:100%;overflow-x:hidden;overflow-y:auto}.schema-editor__object-level{margin:8px 8px 16px}.schema-editor__object-level-title{display:flex;flex-direction:column;gap:4px;padding-bottom:8px;margin-bottom:8px;color:var(--cds-text-secondary);font-size:14px;border-bottom:1px solid var(--cds-border-subtle)}.schema-editor__property{margin-bottom:4px}:host ::ng-deep{--jse-button-primary-background-highlight: var(--cds-button-primary-hover);--jse-button-primary-background: var(--cds-button-primary)}:host ::ng-deep .jse-button:hover,:host ::ng-deep .jse-nested-array-action:hover{background:var(--cds-button-primary-hover)!important}:host ::ng-deep .jse-nested-array-action,:host ::ng-deep .jse-modal-wrapper>.jse-header{background:var(--cds-button-primary)!important}:host ::ng-deep .jse-menu{background:var(--cds-background-inverse-hover)!important}:host ::ng-deep .jse-selected{color:var(--cds-button-primary)!important}:host ::ng-deep .jse-selected:hover{color:var(--cds-white)!important}:host ::ng-deep .required-panel{display:flex;align-items:center;gap:12px;margin-right:16px}:host ::ng-deep .required-panel .req-row{display:flex;align-items:center;gap:4px}:host ::ng-deep .schema-editor__property .cds--checkbox-label{color:var(--cds-text-primary)}\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: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$4.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1$4.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "pipe", type: i1$4.AsyncPipe, name: "async" }, { kind: "ngmodule", type: ButtonModule }, { kind: "directive", type: i2$2.Button, selector: "[cdsButton], [ibmButton]", inputs: ["ibmButton", "cdsButton", "size", "skeleton", "iconOnly", "isExpressive"] }, { kind: "pipe", type: TranslatePipe, name: "translate" }, { kind: "ngmodule", type: ConfirmationModalModule }, { kind: "component", type: ConfirmationModalComponent, selector: "valtimo-confirmation-modal", inputs: ["titleTranslationKey", "title", "content", "contentTranslationKey", "confirmButtonText", "confirmButtonTextTranslationKey", "confirmButtonType", "showOptionalButton", "optionalButtonText", "optionalButtonTextTranslationKey", "optionalButtonType", "cancelButtonText", "cancelButtonTextTranslationKey", "cancelButtonType", "showModalSubject$", "outputOnConfirm", "outputOnOptional", "spacerAfterCancelButton"], outputs: ["confirmEvent", "optionalEvent", "cancelEvent"] }, { kind: "ngmodule", type: DialogModule }, { kind: "ngmodule", type: CheckboxModule }, { kind: "component", type: i2$2.Checkbox, selector: "cds-checkbox, ibm-checkbox", inputs: ["disabled", "skeleton", "hideLabel", "name", "id", "required", "value", "ariaLabel", "ariaLabelledby", "indeterminate", "checked"], outputs: ["click", "checkedChange", "indeterminateChange"] }, { kind: "ngmodule", type: IconModule }, { kind: "directive", type: i2$2.IconDirective, selector: "[cdsIcon], [ibmIcon]", inputs: ["ibmIcon", "cdsIcon", "size", "title", "ariaLabel", "ariaLabelledBy", "ariaHidden", "isFocusable"] }, { kind: "ngmodule", type: InputModule$1 }, { kind: "ngmodule", type: TagModule }, { kind: "ngmodule", type: ModalModule$1 }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.20", ngImport: i0, type: SchemaEditorComponent, deps: [{ token: i0.NgZone }, { token: i2$3.IconService }], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.20", type: SchemaEditorComponent, isStandalone: true, selector: "valtimo-schema-editor", inputs: { schemaJson: "schemaJson", disabled: "disabled" }, outputs: { changeEvent: "changeEvent", saveEvent: "saveEvent", validEvent: "validEvent" }, viewQueries: [{ propertyName: "hostEl", first: true, predicate: ["host"], descendants: true, static: true }], 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  ~\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 class=\"schema-editor\">\n  <div class=\"cds--toolbar-content\">\n    <ng-content></ng-content>\n\n    <button cdsButton=\"ghost\" (click)=\"onRequiredPanelToggle()\">\n      {{ 'schemaEditor.manageRequiredFields' | translate }}\n\n      <svg class=\"cds--btn__icon\" cdsIcon=\"document--requirements\" size=\"16\"></svg>\n    </button>\n\n    <button\n      cdsButton=\"primary\"\n      [disabled]=\"disabled || (valid$ | async) === false\"\n      (click)=\"onSaveClick()\"\n    >\n      {{ 'interface.save' | translate }}\n\n      <svg cdsIcon=\"save\" size=\"16\" class=\"cds--btn__icon\"></svg>\n    </button>\n  </div>\n\n  <div class=\"jse-host-container\">\n    <div [attr.data-carbon-theme]=\"'g10'\" class=\"jse-host\" #host></div>\n\n    <div\n      class=\"requirements-panel\"\n      [ngClass]=\"{'requirements-panel--open': showRequiredPanel$ | async}\"\n    >\n      <ng-container *ngTemplateOutlet=\"requiredPropertiesPanel\"></ng-container>\n    </div>\n  </div>\n</div>\n\n<valtimo-confirmation-modal\n  [showModalSubject$]=\"showSaveConfirmationModal$\"\n  cancelButtonTextTranslationKey=\"interface.cancel\"\n  confirmButtonTextTranslationKey=\"interface.save\"\n  contentTranslationKey=\"interface.jsonEditor.saveModalContent\"\n  titleTranslationKey=\"interface.save\"\n  (cancelEvent)=\"hideConfirmationModal()\"\n  (confirmEvent)=\"onSaveChanges()\"\n>\n</valtimo-confirmation-modal>\n\n<ng-template #requiredPropertiesPanel>\n  <div class=\"schema-editor__required-properties\" (click)=\"$event.stopPropagation()\">\n    <header class=\"cds--modal-header default schema-editor__required-properties-header\">\n      <h5>\n        {{ 'schemaEditor.requiredFields' | translate }}\n      </h5>\n\n      <div class=\"cds--modal-close-button\">\n        <button\n          cdsButton=\"primary\"\n          class=\"cds--modal-close cds--btn--icon-only cds--btn--lg\"\n          type=\"button\"\n          (click)=\"onRequiredPanelToggle()\"\n        >\n          <svg cdsIcon=\"close\" size=\"20\" class=\"cds--modal-close__icon\"></svg>\n        </button>\n      </div>\n    </header>\n\n    <div class=\"schema-editor__required-properties-content\">\n      @for (objectLevel of objectLevels$ | async; track $index) {\n        <div class=\"schema-editor__object-level\">\n          <span class=\"schema-editor__object-level-title\">\n            @if ((objectLevel.path || []).length === 0) {\n              {{ 'schemaEditor.rootObject' | translate }}\n            } @else {\n              @for (pathParth of objectLevel.path; track pathParth; let last = $last) {\n                <span class=\"schema-editor__object-level-title-part\">{{\n                  pathParth + (!last ? ' >' : '')\n                }}</span>\n              }\n            }\n          </span>\n\n          @for (property of objectLevel.properties; track property) {\n            <div class=\"schema-editor__property\">\n              <cds-checkbox\n                [disabled]=\"disabled\"\n                [checked]=\"isRequired$(objectLevel.path, property) | async\"\n                (checkedChange)=\"onRequiredPropertyChange(objectLevel.path, property, $event)\"\n              >\n                {{ property }}\n              </cds-checkbox>\n            </div>\n          }\n        </div>\n      }\n    </div>\n  </div>\n</ng-template>\n", styles: [".jse-host,.jse-host-container,:host{display:block;width:100%;height:100%}.jse-host-container{position:relative;overflow:hidden}.requirements-panel{position:absolute;top:0;right:0;width:350px;height:100%;outline:1px solid var(--cds-border-subtle);outline-offset:-1px;transform:translate(350px);transition:transform .24s cubic-bezier(0,0,.3,1)}.requirements-panel--open{transform:translate(0)}.schema-editor,.schema-editor__required-properties{display:flex;flex-direction:column;width:100%;height:100%;background:var(--cds-layer)}.schema-editor__required-properties-header{margin:1px;padding-top:12px;padding-bottom:12px;border-bottom:1px solid var(--cds-border-subtle)}.schema-editor__required-properties-content{width:100%;height:100%;overflow-x:hidden;overflow-y:auto}.schema-editor__object-level{margin:8px 8px 16px}.schema-editor__object-level-title{display:flex;flex-direction:column;gap:4px;padding-bottom:8px;margin-bottom:8px;color:var(--cds-text-secondary);font-size:14px;border-bottom:1px solid var(--cds-border-subtle)}.schema-editor__property{margin-bottom:4px}:host ::ng-deep{--jse-button-primary-background-highlight: var(--cds-button-primary-hover);--jse-button-primary-background: var(--cds-button-primary)}:host ::ng-deep .jse-button:hover,:host ::ng-deep .jse-nested-array-action:hover{background:var(--cds-button-primary-hover)!important}:host ::ng-deep .jse-nested-array-action,:host ::ng-deep .jse-modal-wrapper>.jse-header{background:var(--cds-button-primary)!important}:host ::ng-deep .jse-menu{background:var(--cds-background-inverse-hover)!important}:host ::ng-deep .jse-selected{color:var(--cds-button-primary)!important}:host ::ng-deep .jse-selected:hover{color:var(--cds-white)!important}:host ::ng-deep .required-panel{display:flex;align-items:center;gap:12px;margin-right:16px}:host ::ng-deep .required-panel .req-row{display:flex;align-items:center;gap:4px}:host ::ng-deep .schema-editor__property .cds--checkbox-label{color:var(--cds-text-primary)}\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: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$4.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1$4.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "pipe", type: i1$4.AsyncPipe, name: "async" }, { kind: "ngmodule", type: ButtonModule }, { kind: "directive", type: i2$3.Button, selector: "[cdsButton], [ibmButton]", inputs: ["ibmButton", "cdsButton", "size", "skeleton", "iconOnly", "isExpressive"] }, { kind: "pipe", type: TranslatePipe, name: "translate" }, { kind: "ngmodule", type: ConfirmationModalModule }, { kind: "component", type: ConfirmationModalComponent, selector: "valtimo-confirmation-modal", inputs: ["titleTranslationKey", "title", "content", "contentTranslationKey", "confirmButtonText", "confirmButtonTextTranslationKey", "confirmButtonType", "showOptionalButton", "optionalButtonText", "optionalButtonTextTranslationKey", "optionalButtonType", "cancelButtonText", "cancelButtonTextTranslationKey", "cancelButtonType", "showModalSubject$", "outputOnConfirm", "outputOnOptional", "spacerAfterCancelButton"], outputs: ["confirmEvent", "optionalEvent", "cancelEvent"] }, { kind: "ngmodule", type: DialogModule }, { kind: "ngmodule", type: CheckboxModule }, { kind: "component", type: i2$3.Checkbox, selector: "cds-checkbox, ibm-checkbox", inputs: ["disabled", "skeleton", "hideLabel", "name", "id", "required", "value", "ariaLabel", "ariaLabelledby", "indeterminate", "checked"], outputs: ["click", "checkedChange", "indeterminateChange"] }, { 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: InputModule$1 }, { kind: "ngmodule", type: TagModule }, { kind: "ngmodule", type: ModalModule$1 }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.20", ngImport: i0, type: SchemaEditorComponent, decorators: [{
             type: Component,
@@ -17401,7 +17574,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.20", ngImpo
                         TagModule,
                         ModalModule$1,
                     ], changeDetection: ChangeDetectionStrategy.OnPush, 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  ~\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 class=\"schema-editor\">\n  <div class=\"cds--toolbar-content\">\n    <ng-content></ng-content>\n\n    <button cdsButton=\"ghost\" (click)=\"onRequiredPanelToggle()\">\n      {{ 'schemaEditor.manageRequiredFields' | translate }}\n\n      <svg class=\"cds--btn__icon\" cdsIcon=\"document--requirements\" size=\"16\"></svg>\n    </button>\n\n    <button\n      cdsButton=\"primary\"\n      [disabled]=\"disabled || (valid$ | async) === false\"\n      (click)=\"onSaveClick()\"\n    >\n      {{ 'interface.save' | translate }}\n\n      <svg cdsIcon=\"save\" size=\"16\" class=\"cds--btn__icon\"></svg>\n    </button>\n  </div>\n\n  <div class=\"jse-host-container\">\n    <div [attr.data-carbon-theme]=\"'g10'\" class=\"jse-host\" #host></div>\n\n    <div\n      class=\"requirements-panel\"\n      [ngClass]=\"{'requirements-panel--open': showRequiredPanel$ | async}\"\n    >\n      <ng-container *ngTemplateOutlet=\"requiredPropertiesPanel\"></ng-container>\n    </div>\n  </div>\n</div>\n\n<valtimo-confirmation-modal\n  [showModalSubject$]=\"showSaveConfirmationModal$\"\n  cancelButtonTextTranslationKey=\"interface.cancel\"\n  confirmButtonTextTranslationKey=\"interface.save\"\n  contentTranslationKey=\"interface.jsonEditor.saveModalContent\"\n  titleTranslationKey=\"interface.save\"\n  (cancelEvent)=\"hideConfirmationModal()\"\n  (confirmEvent)=\"onSaveChanges()\"\n>\n</valtimo-confirmation-modal>\n\n<ng-template #requiredPropertiesPanel>\n  <div class=\"schema-editor__required-properties\" (click)=\"$event.stopPropagation()\">\n    <header class=\"cds--modal-header default schema-editor__required-properties-header\">\n      <h5>\n        {{ 'schemaEditor.requiredFields' | translate }}\n      </h5>\n\n      <div class=\"cds--modal-close-button\">\n        <button\n          cdsButton=\"primary\"\n          class=\"cds--modal-close cds--btn--icon-only cds--btn--lg\"\n          type=\"button\"\n          (click)=\"onRequiredPanelToggle()\"\n        >\n          <svg cdsIcon=\"close\" size=\"20\" class=\"cds--modal-close__icon\"></svg>\n        </button>\n      </div>\n    </header>\n\n    <div class=\"schema-editor__required-properties-content\">\n      @for (objectLevel of objectLevels$ | async; track $index) {\n        <div class=\"schema-editor__object-level\">\n          <span class=\"schema-editor__object-level-title\">\n            @if ((objectLevel.path || []).length === 0) {\n              {{ 'schemaEditor.rootObject' | translate }}\n            } @else {\n              @for (pathParth of objectLevel.path; track pathParth; let last = $last) {\n                <span class=\"schema-editor__object-level-title-part\">{{\n                  pathParth + (!last ? ' >' : '')\n                }}</span>\n              }\n            }\n          </span>\n\n          @for (property of objectLevel.properties; track property) {\n            <div class=\"schema-editor__property\">\n              <cds-checkbox\n                [disabled]=\"disabled\"\n                [checked]=\"isRequired$(objectLevel.path, property) | async\"\n                (checkedChange)=\"onRequiredPropertyChange(objectLevel.path, property, $event)\"\n              >\n                {{ property }}\n              </cds-checkbox>\n            </div>\n          }\n        </div>\n      }\n    </div>\n  </div>\n</ng-template>\n", styles: [".jse-host,.jse-host-container,:host{display:block;width:100%;height:100%}.jse-host-container{position:relative;overflow:hidden}.requirements-panel{position:absolute;top:0;right:0;width:350px;height:100%;outline:1px solid var(--cds-border-subtle);outline-offset:-1px;transform:translate(350px);transition:transform .24s cubic-bezier(0,0,.3,1)}.requirements-panel--open{transform:translate(0)}.schema-editor,.schema-editor__required-properties{display:flex;flex-direction:column;width:100%;height:100%;background:var(--cds-layer)}.schema-editor__required-properties-header{margin:1px;padding-top:12px;padding-bottom:12px;border-bottom:1px solid var(--cds-border-subtle)}.schema-editor__required-properties-content{width:100%;height:100%;overflow-x:hidden;overflow-y:auto}.schema-editor__object-level{margin:8px 8px 16px}.schema-editor__object-level-title{display:flex;flex-direction:column;gap:4px;padding-bottom:8px;margin-bottom:8px;color:var(--cds-text-secondary);font-size:14px;border-bottom:1px solid var(--cds-border-subtle)}.schema-editor__property{margin-bottom:4px}:host ::ng-deep{--jse-button-primary-background-highlight: var(--cds-button-primary-hover);--jse-button-primary-background: var(--cds-button-primary)}:host ::ng-deep .jse-button:hover,:host ::ng-deep .jse-nested-array-action:hover{background:var(--cds-button-primary-hover)!important}:host ::ng-deep .jse-nested-array-action,:host ::ng-deep .jse-modal-wrapper>.jse-header{background:var(--cds-button-primary)!important}:host ::ng-deep .jse-menu{background:var(--cds-background-inverse-hover)!important}:host ::ng-deep .jse-selected{color:var(--cds-button-primary)!important}:host ::ng-deep .jse-selected:hover{color:var(--cds-white)!important}:host ::ng-deep .required-panel{display:flex;align-items:center;gap:12px;margin-right:16px}:host ::ng-deep .required-panel .req-row{display:flex;align-items:center;gap:4px}:host ::ng-deep .schema-editor__property .cds--checkbox-label{color:var(--cds-text-primary)}\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.NgZone }, { type: i2$2.IconService }], propDecorators: { hostEl: [{
+        }], ctorParameters: () => [{ type: i0.NgZone }, { type: i2$3.IconService }], propDecorators: { hostEl: [{
                 type: ViewChild,
                 args: ['host', { static: true }]
             }], schemaJson: [{
@@ -17615,6 +17788,7 @@ class MuuriDirective {
         this._muuriSubject$ = new BehaviorSubject(null);
         this._containerWidthSubject$ = new BehaviorSubject(0);
         this._mutationTrigger$ = new BehaviorSubject(null);
+        this._layoutDebounceTimer = null;
         this._subscriptions = new Subscription();
     }
     ngAfterViewInit() {
@@ -17631,14 +17805,18 @@ class MuuriDirective {
                     return;
                 }
                 this.initMuuri();
+                this.initItemResizeObserver();
                 this.openContainerChangeSubscription();
                 this._mutationTrigger$.next(null);
             });
         });
     }
     ngOnDestroy() {
-        this.resizeObserver?.disconnect();
-        this.mutationObserver?.disconnect();
+        this._containerResizeObserver?.disconnect();
+        this._itemResizeObserver?.disconnect();
+        this._mutationObserver?.disconnect();
+        if (this._layoutDebounceTimer)
+            clearTimeout(this._layoutDebounceTimer);
         this._subscriptions.unsubscribe();
         this._muuriSubject$.value?.destroy?.();
     }
@@ -17655,6 +17833,47 @@ class MuuriDirective {
             layoutOnResize: false,
         }));
     }
+    /**
+     * Create a ResizeObserver that watches each direct child (Muuri item) for
+     * size changes. This catches image loads, async content rendering, font
+     * loading, and any other change that alters an item's height without
+     * triggering a DOM mutation.
+     */
+    initItemResizeObserver() {
+        if (typeof ResizeObserver === 'undefined')
+            return;
+        this._itemResizeObserver = new ResizeObserver(() => {
+            this.debouncedLayout();
+        });
+        this.observeCurrentItems();
+    }
+    /**
+     * Start observing all current direct children that are not yet observed.
+     * Called on init and whenever the MutationObserver detects new children.
+     */
+    observeCurrentItems() {
+        if (!this._itemResizeObserver)
+            return;
+        const container = this.elementRef.nativeElement;
+        Array.from(container.children).forEach(child => {
+            this._itemResizeObserver.observe(child);
+        });
+    }
+    /**
+     * Debounced refresh + layout to batch rapid item size changes (e.g. multiple
+     * images loading in quick succession) into a single Muuri re-layout.
+     */
+    debouncedLayout() {
+        if (this._layoutDebounceTimer)
+            clearTimeout(this._layoutDebounceTimer);
+        this._layoutDebounceTimer = setTimeout(() => {
+            this._layoutDebounceTimer = null;
+            if (this._muuri) {
+                this._muuri.refreshItems();
+                this._muuri.layout(true);
+            }
+        }, 50);
+    }
     observeContainerWidthChanges() {
         const nativeElement = this.elementRef.nativeElement;
         const getWidth = () => {
@@ -17662,8 +17881,8 @@ class MuuriDirective {
             this._containerWidthSubject$.next(width);
         };
         if (typeof ResizeObserver !== 'undefined') {
-            this.resizeObserver = new ResizeObserver(() => getWidth());
-            this.resizeObserver.observe(nativeElement);
+            this._containerResizeObserver = new ResizeObserver(() => getWidth());
+            this._containerResizeObserver.observe(nativeElement);
         }
         if (typeof window !== 'undefined') {
             this._subscriptions.add(fromEvent(window, 'resize').subscribe(() => getWidth()));
@@ -17675,7 +17894,7 @@ class MuuriDirective {
             return;
         }
         const nativeElement = this.elementRef.nativeElement;
-        this.mutationObserver = new MutationObserver(() => {
+        this._mutationObserver = new MutationObserver(() => {
             if (!this._muuri)
                 return;
             const container = this.elementRef.nativeElement;
@@ -17683,16 +17902,18 @@ class MuuriDirective {
             if (items.length > 0) {
                 this._muuri.add(items);
             }
+            // Ensure newly added items are observed for size changes
+            this.observeCurrentItems();
             this._mutationTrigger$.next(null);
         });
-        this.mutationObserver.observe(nativeElement, {
+        this._mutationObserver.observe(nativeElement, {
             childList: true,
             subtree: true,
         });
     }
     openContainerChangeSubscription() {
         this._subscriptions.add(combineLatest([this._containerWidth$, this._mutationTrigger$])
-            .pipe(tap(([containerWidth]) => {
+            .pipe(tap$1(([containerWidth]) => {
             const nativeElement = this.elementRef.nativeElement;
             const children = Array.from(nativeElement.children);
             const amountOfHorizontalElements = Math.floor(containerWidth / this.columnMinWidth);
@@ -17703,7 +17924,7 @@ class MuuriDirective {
                 item.style.setProperty('position', 'absolute');
                 item.style.setProperty('width', `${widthPerElement}px`);
             });
-        }), switchMap(() => this._muuri$), tap(muuri => {
+        }), switchMap(() => this._muuri$), tap$1(muuri => {
             muuri.refreshItems();
             muuri.layout(true);
         }))
@@ -18178,8 +18399,8 @@ class AssignmentComponent {
         this._candidateTeamsSubscription?.unsubscribe();
         this._candidateTeamsSubscription = null;
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.20", ngImport: i0, type: AssignmentComponent, deps: [{ token: CdsThemeService }, { token: i2$2.IconService }, { token: i1.TranslateService }, { token: i6.UserProviderService }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.20", type: AssignmentComponent, isStandalone: true, selector: "valtimo-assignment", inputs: { mode: "mode", hasPermission: "hasPermission", assigneeId: "assigneeId", assigneeFullName: "assigneeFullName", assignedTeamKey: "assignedTeamKey", assignedTeamTitle: "assignedTeamTitle", candidateUsers$: "candidateUsers$", candidateTeams$: "candidateTeams$" }, outputs: { assignmentChangedEvent: "assignmentChangedEvent", unassignedEvent: "unassignedEvent" }, host: { properties: { "style.display": "this.hostDisplay" } }, usesOnChanges: 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-container\n  *ngIf=\"{\n    disabled: disabled$ | async,\n    loading: loading$ | async,\n    userItems: userItems$ | async,\n    teamItems: teamItems$ | async,\n    mouseIsOver: mouseIsOver$ | async,\n    selectedUserId: selectedUserId$ | async,\n    selectedTeamKey: selectedTeamKey$ | async,\n    editToggletipOpen: editToggletipOpen$ | async,\n    showUserComboBox: showUserComboBox$ | async,\n    showTeamComboBox: showTeamComboBox$ | async,\n  } as obs\"\n>\n  <ng-container *ngIf=\"isAssigned || hasPermission\">\n    <div\n      class=\"assignment-container\"\n      (mouseenter)=\"onMouseEnter()\"\n      (mouseleave)=\"onMouseLeave()\"\n    >\n      <!-- Assigned state: display pills with icons -->\n      <div\n        class=\"assigned-display element\"\n        [ngClass]=\"{\n          active: hasPermission\n            ? isAssigned && !obs.mouseIsOver && !obs.editToggletipOpen\n            : isAssigned,\n        }\"\n      >\n        <span class=\"assignment-pill\" *ngIf=\"_assignedTeamKey\">\n          <svg cdsIcon=\"group\" size=\"16\" class=\"pill-icon\"></svg>\n          <span class=\"pill-text\">{{ _assignedTeamTitle }}</span>\n        </span>\n\n        <span class=\"assignment-pill\" *ngIf=\"_assigneeId\">\n          <svg cdsIcon=\"user\" size=\"16\" class=\"pill-icon\"></svg>\n          <span class=\"pill-text\">{{ _assigneeFullName || _assigneeId }}</span>\n        </span>\n      </div>\n\n      <!-- Click to edit button (appears on hover when assigned) -->\n      <cds-toggletip\n        *ngIf=\"hasPermission && isAssigned\"\n        align=\"bottom\"\n        class=\"element\"\n        [autoAlign]=\"true\"\n        [isOpen]=\"open$ | async\"\n        [ngClass]=\"{active: isAssigned && (obs.mouseIsOver || obs.editToggletipOpen)}\"\n        (onOpen)=\"onOpenEditToggletip()\"\n        (onClose)=\"onCloseEditToggletip()\"\n      >\n        <button\n          cdsToggletipButton\n          [removeClassnames]=\"['cds--toggletip-button']\"\n          cdsButton=\"ghost\"\n          size=\"sm\"\n          class=\"click-to-edit-button\"\n        >\n          {{ 'assignment.clickToEdit' | translate }}\n        </button>\n\n        <div cdsToggletipContent class=\"assignment-popover-content\">\n          <cds-combo-box\n            *ngIf=\"obs.showUserComboBox && obs.userItems?.length > 0\"\n            [attr.data-carbon-theme]=\"toggletipDropdownTheme$ | async\"\n            [label]=\"'assignment.selectUser' | translate\"\n            [placeholder]=\"'assignment.selectUser' | translate\"\n            [appendInline]=\"true\"\n            [dropUp]=\"false\"\n            [cdsLayer]=\"1\"\n            [items]=\"obs.userItems\"\n            [disabled]=\"obs.disabled\"\n            itemValueKey=\"id\"\n            (selected)=\"onUserSelect($event)\"\n            (clear)=\"onUserClear()\"\n          >\n            <cds-dropdown-list onclick=\"event.stopPropagation()\"></cds-dropdown-list>\n          </cds-combo-box>\n\n          <cds-combo-box\n            *ngIf=\"obs.showTeamComboBox && obs.teamItems?.length > 0\"\n            [attr.data-carbon-theme]=\"toggletipDropdownTheme$ | async\"\n            [label]=\"'assignment.selectTeam' | translate\"\n            [placeholder]=\"'assignment.selectTeam' | translate\"\n            [appendInline]=\"true\"\n            [dropUp]=\"false\"\n            [cdsLayer]=\"1\"\n            [items]=\"obs.teamItems\"\n            [disabled]=\"obs.disabled\"\n            itemValueKey=\"id\"\n            (selected)=\"onTeamSelect($event)\"\n            (clear)=\"onTeamClear()\"\n          >\n            <cds-dropdown-list onclick=\"event.stopPropagation()\"></cds-dropdown-list>\n          </cds-combo-box>\n\n          <button\n            cdsButton\n            [attr.data-carbon-theme]=\"toggletipTheme$ | async\"\n            [cdsLayer]=\"1\"\n            class=\"submit-button\"\n            [disabled]=\"!hasEditChanges || obs.disabled\"\n            (click)=\"onUpdate()\"\n          >\n            {{ 'assignment.update' | translate }}\n          </button>\n\n          <button\n            cdsButton=\"danger--tertiary\"\n            [cdsLayer]=\"1\"\n            [attr.data-carbon-theme]=\"toggletipTheme$ | async\"\n            [disabled]=\"obs.disabled\"\n            (click)=\"onUnassign()\"\n          >\n            {{ 'assignment.unassignAll' | translate }}\n          </button>\n        </div>\n      </cds-toggletip>\n\n      <!-- Assign button: always rendered for layout sizing (position: relative via .main).\n           When hasPermission is false it stays hidden and non-interactive. -->\n      <cds-toggletip\n        align=\"bottom\"\n        class=\"element main\"\n        [autoAlign]=\"true\"\n        [isOpen]=\"open$ | async\"\n        [ngClass]=\"{active: hasPermission && !isAssigned}\"\n        (onOpen)=\"onOpenAssignToggletip()\"\n      >\n        <button\n          cdsToggletipButton\n          [removeClassnames]=\"['cds--toggletip-button']\"\n          cdsButton=\"tertiary\"\n          size=\"sm\"\n          class=\"assign-button\"\n        >\n          <svg class=\"cds--btn__icon\" cdsIcon=\"user--follow\" size=\"16\"></svg>\n\n          {{ assignButtonTranslationKey | translate }}\n        </button>\n\n        <div cdsToggletipContent class=\"assignment-popover-content\">\n          <ng-container *ngIf=\"!obs.loading; else loadingTemplate\">\n            <cds-combo-box\n              *ngIf=\"obs.showUserComboBox && obs.userItems?.length > 0\"\n              [attr.data-carbon-theme]=\"toggletipDropdownTheme$ | async\"\n              [label]=\"'assignment.selectUser' | translate\"\n              [placeholder]=\"'assignment.selectUser' | translate\"\n              [appendInline]=\"true\"\n              [dropUp]=\"false\"\n              [cdsLayer]=\"1\"\n              [items]=\"obs.userItems\"\n              [disabled]=\"obs.disabled\"\n              (selected)=\"onUserSelect($event)\"\n              (clear)=\"onUserClear()\"\n            >\n              <cds-dropdown-list onclick=\"event.stopPropagation()\"></cds-dropdown-list>\n            </cds-combo-box>\n\n            <cds-combo-box\n              *ngIf=\"obs.showTeamComboBox && obs.teamItems?.length > 0\"\n              [attr.data-carbon-theme]=\"toggletipDropdownTheme$ | async\"\n              [label]=\"'assignment.selectTeam' | translate\"\n              [placeholder]=\"'assignment.selectTeam' | translate\"\n              [appendInline]=\"true\"\n              [dropUp]=\"false\"\n              [cdsLayer]=\"1\"\n              [items]=\"obs.teamItems\"\n              [disabled]=\"obs.disabled\"\n              (selected)=\"onTeamSelect($event)\"\n              (clear)=\"onTeamClear()\"\n            >\n              <cds-dropdown-list onclick=\"event.stopPropagation()\"></cds-dropdown-list>\n            </cds-combo-box>\n\n            <button\n              cdsButton\n              [attr.data-carbon-theme]=\"toggletipTheme$ | async\"\n              class=\"submit-button\"\n              [disabled]=\"(!obs.selectedUserId && !obs.selectedTeamKey) || obs.disabled\"\n              (click)=\"onConfirm()\"\n            >\n              {{ 'assignment.confirm' | translate }}\n\n              <svg class=\"cds--btn__icon\" cdsIcon=\"user--follow\" size=\"16\"></svg>\n            </button>\n          </ng-container>\n\n          <ng-template #loadingTemplate>\n            <span class=\"loading-text\" [attr.data-carbon-theme]=\"toggletipTheme$ | async\">\n              {{ 'assignment.loading' | translate }}\n            </span>\n          </ng-template>\n        </div>\n      </cds-toggletip>\n    </div>\n  </ng-container>\n</ng-container>\n", styles: [":host ::ng-deep .cds--popover-content{max-inline-size:unset}.assignment-container{display:flex;align-items:center;justify-content:center;position:relative;font-weight:400;font-size:14px;line-height:18px;letter-spacing:.16px;color:var(--cds-link-01)}.assigned-display{display:flex;justify-content:flex-start;align-items:center;gap:8px;width:100%}.assignment-pill{display:inline-flex;align-items:center;gap:4px;min-width:0;max-width:calc(50% - 4px);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.assignment-pill:only-child{max-width:100%}.assignment-pill .pill-icon{flex-shrink:0;fill:currentColor}.assignment-pill .pill-text{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.element{opacity:0;visibility:hidden;position:absolute;width:100%;transition:opacity .3s ease-in-out}.element.active{opacity:1;visibility:visible}.element.main{position:relative;width:auto}.assignment-popover-content{width:400px;max-inline-size:400px;display:flex;flex-direction:column;gap:16px}.assignment-popover-content .cds--btn{width:100%;max-width:unset}.assign-button{width:250px}.click-to-edit-button{width:100%}.submit-button{width:100%;max-width:unset}.loading-text{font-size:14px;color:var(--cds-text-secondary)}\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: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$4.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1$4.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "pipe", type: i1$4.AsyncPipe, name: "async" }, { kind: "ngmodule", type: TranslateModule }, { kind: "pipe", type: i1.TranslatePipe, name: "translate" }, { kind: "ngmodule", type: ButtonModule }, { kind: "directive", type: i2$2.Button, selector: "[cdsButton], [ibmButton]", inputs: ["ibmButton", "cdsButton", "size", "skeleton", "iconOnly", "isExpressive"] }, { kind: "ngmodule", type: ToggletipModule }, { kind: "component", type: i2$2.Toggletip, selector: "cds-toggletip, ibm-toggletip", inputs: ["id", "isOpen"] }, { kind: "directive", type: i2$2.ToggletipButton, selector: "[cdsToggletipButton], [ibmToggletipButton]", inputs: ["ariaLabel"] }, { kind: "directive", type: i2$2.ToggletipContent, selector: "[cdsToggletipContent], [ibmToggletipContent]" }, { kind: "ngmodule", type: IconModule }, { kind: "directive", type: i2$2.IconDirective, selector: "[cdsIcon], [ibmIcon]", inputs: ["ibmIcon", "cdsIcon", "size", "title", "ariaLabel", "ariaLabelledBy", "ariaHidden", "isFocusable"] }, { kind: "ngmodule", type: LayerModule }, { kind: "directive", type: i2$2.LayerDirective, selector: "[cdsLayer], [ibmLayer]", inputs: ["ibmLayer", "cdsLayer"], exportAs: ["layer"] }, { kind: "ngmodule", type: ComboBoxModule }, { kind: "component", type: i2$2.ComboBox, selector: "cds-combo-box, ibm-combo-box", inputs: ["placeholder", "openMenuAria", "closeMenuAria", "clearSelectionsTitle", "clearSelectionsAria", "clearSelectionTitle", "clearSelectionAria", "id", "labelId", "items", "type", "size", "itemValueKey", "label", "hideLabel", "helperText", "appendInline", "invalid", "invalidText", "warn", "warnText", "maxLength", "theme", "selectionFeedback", "autocomplete", "dropUp", "disabled", "readonly", "fluid"], outputs: ["selected", "submit", "close", "search", "clear"] }, { kind: "component", type: i2$2.DropdownList, selector: "cds-dropdown-list, ibm-dropdown-list", inputs: ["ariaLabel", "items", "listTpl", "type", "showTitles"], outputs: ["select", "scroll", "blurIntent"] }, { kind: "directive", type: RemoveClassnamesDirective, selector: "[removeClassnames]", inputs: ["removeClassnames"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.20", ngImport: i0, type: AssignmentComponent, deps: [{ token: CdsThemeService }, { token: i2$3.IconService }, { token: i1.TranslateService }, { token: i6$1.UserProviderService }], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.20", type: AssignmentComponent, isStandalone: true, selector: "valtimo-assignment", inputs: { mode: "mode", hasPermission: "hasPermission", assigneeId: "assigneeId", assigneeFullName: "assigneeFullName", assignedTeamKey: "assignedTeamKey", assignedTeamTitle: "assignedTeamTitle", candidateUsers$: "candidateUsers$", candidateTeams$: "candidateTeams$" }, outputs: { assignmentChangedEvent: "assignmentChangedEvent", unassignedEvent: "unassignedEvent" }, host: { properties: { "style.display": "this.hostDisplay" } }, usesOnChanges: 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-container\n  *ngIf=\"{\n    disabled: disabled$ | async,\n    loading: loading$ | async,\n    userItems: userItems$ | async,\n    teamItems: teamItems$ | async,\n    mouseIsOver: mouseIsOver$ | async,\n    selectedUserId: selectedUserId$ | async,\n    selectedTeamKey: selectedTeamKey$ | async,\n    editToggletipOpen: editToggletipOpen$ | async,\n    showUserComboBox: showUserComboBox$ | async,\n    showTeamComboBox: showTeamComboBox$ | async,\n  } as obs\"\n>\n  <ng-container *ngIf=\"isAssigned || hasPermission\">\n    <div\n      class=\"assignment-container\"\n      (mouseenter)=\"onMouseEnter()\"\n      (mouseleave)=\"onMouseLeave()\"\n    >\n      <!-- Assigned state: display pills with icons -->\n      <div\n        class=\"assigned-display element\"\n        [ngClass]=\"{\n          active: hasPermission\n            ? isAssigned && !obs.mouseIsOver && !obs.editToggletipOpen\n            : isAssigned,\n        }\"\n      >\n        <span class=\"assignment-pill\" *ngIf=\"_assignedTeamKey\">\n          <svg cdsIcon=\"group\" size=\"16\" class=\"pill-icon\"></svg>\n          <span class=\"pill-text\">{{ _assignedTeamTitle }}</span>\n        </span>\n\n        <span class=\"assignment-pill\" *ngIf=\"_assigneeId\">\n          <svg cdsIcon=\"user\" size=\"16\" class=\"pill-icon\"></svg>\n          <span class=\"pill-text\">{{ _assigneeFullName || _assigneeId }}</span>\n        </span>\n      </div>\n\n      <!-- Click to edit button (appears on hover when assigned) -->\n      <cds-toggletip\n        *ngIf=\"hasPermission && isAssigned\"\n        align=\"bottom\"\n        class=\"element\"\n        [autoAlign]=\"true\"\n        [isOpen]=\"open$ | async\"\n        [ngClass]=\"{active: isAssigned && (obs.mouseIsOver || obs.editToggletipOpen)}\"\n        (onOpen)=\"onOpenEditToggletip()\"\n        (onClose)=\"onCloseEditToggletip()\"\n      >\n        <button\n          cdsToggletipButton\n          [removeClassnames]=\"['cds--toggletip-button']\"\n          cdsButton=\"ghost\"\n          size=\"sm\"\n          class=\"click-to-edit-button\"\n        >\n          {{ 'assignment.clickToEdit' | translate }}\n        </button>\n\n        <div cdsToggletipContent class=\"assignment-popover-content\">\n          <cds-combo-box\n            *ngIf=\"obs.showUserComboBox && obs.userItems?.length > 0\"\n            [attr.data-carbon-theme]=\"toggletipDropdownTheme$ | async\"\n            [label]=\"'assignment.selectUser' | translate\"\n            [placeholder]=\"'assignment.selectUser' | translate\"\n            [appendInline]=\"true\"\n            [dropUp]=\"false\"\n            [cdsLayer]=\"1\"\n            [items]=\"obs.userItems\"\n            [disabled]=\"obs.disabled\"\n            itemValueKey=\"id\"\n            (selected)=\"onUserSelect($event)\"\n            (clear)=\"onUserClear()\"\n          >\n            <cds-dropdown-list onclick=\"event.stopPropagation()\"></cds-dropdown-list>\n          </cds-combo-box>\n\n          <cds-combo-box\n            *ngIf=\"obs.showTeamComboBox && obs.teamItems?.length > 0\"\n            [attr.data-carbon-theme]=\"toggletipDropdownTheme$ | async\"\n            [label]=\"'assignment.selectTeam' | translate\"\n            [placeholder]=\"'assignment.selectTeam' | translate\"\n            [appendInline]=\"true\"\n            [dropUp]=\"false\"\n            [cdsLayer]=\"1\"\n            [items]=\"obs.teamItems\"\n            [disabled]=\"obs.disabled\"\n            itemValueKey=\"id\"\n            (selected)=\"onTeamSelect($event)\"\n            (clear)=\"onTeamClear()\"\n          >\n            <cds-dropdown-list onclick=\"event.stopPropagation()\"></cds-dropdown-list>\n          </cds-combo-box>\n\n          <button\n            cdsButton\n            [attr.data-carbon-theme]=\"toggletipTheme$ | async\"\n            [cdsLayer]=\"1\"\n            class=\"submit-button\"\n            [disabled]=\"!hasEditChanges || obs.disabled\"\n            (click)=\"onUpdate()\"\n          >\n            {{ 'assignment.update' | translate }}\n          </button>\n\n          <button\n            cdsButton=\"danger--tertiary\"\n            [cdsLayer]=\"1\"\n            [attr.data-carbon-theme]=\"toggletipTheme$ | async\"\n            [disabled]=\"obs.disabled\"\n            (click)=\"onUnassign()\"\n          >\n            {{ 'assignment.unassignAll' | translate }}\n          </button>\n        </div>\n      </cds-toggletip>\n\n      <!-- Assign button: always rendered for layout sizing (position: relative via .main).\n           When hasPermission is false it stays hidden and non-interactive. -->\n      <cds-toggletip\n        align=\"bottom\"\n        class=\"element main\"\n        [autoAlign]=\"true\"\n        [isOpen]=\"open$ | async\"\n        [ngClass]=\"{active: hasPermission && !isAssigned}\"\n        (onOpen)=\"onOpenAssignToggletip()\"\n      >\n        <button\n          cdsToggletipButton\n          [removeClassnames]=\"['cds--toggletip-button']\"\n          cdsButton=\"tertiary\"\n          size=\"sm\"\n          class=\"assign-button\"\n        >\n          <svg class=\"cds--btn__icon\" cdsIcon=\"user--follow\" size=\"16\"></svg>\n\n          {{ assignButtonTranslationKey | translate }}\n        </button>\n\n        <div cdsToggletipContent class=\"assignment-popover-content\">\n          <ng-container *ngIf=\"!obs.loading; else loadingTemplate\">\n            <cds-combo-box\n              *ngIf=\"obs.showUserComboBox && obs.userItems?.length > 0\"\n              [attr.data-carbon-theme]=\"toggletipDropdownTheme$ | async\"\n              [label]=\"'assignment.selectUser' | translate\"\n              [placeholder]=\"'assignment.selectUser' | translate\"\n              [appendInline]=\"true\"\n              [dropUp]=\"false\"\n              [cdsLayer]=\"1\"\n              [items]=\"obs.userItems\"\n              [disabled]=\"obs.disabled\"\n              (selected)=\"onUserSelect($event)\"\n              (clear)=\"onUserClear()\"\n            >\n              <cds-dropdown-list onclick=\"event.stopPropagation()\"></cds-dropdown-list>\n            </cds-combo-box>\n\n            <cds-combo-box\n              *ngIf=\"obs.showTeamComboBox && obs.teamItems?.length > 0\"\n              [attr.data-carbon-theme]=\"toggletipDropdownTheme$ | async\"\n              [label]=\"'assignment.selectTeam' | translate\"\n              [placeholder]=\"'assignment.selectTeam' | translate\"\n              [appendInline]=\"true\"\n              [dropUp]=\"false\"\n              [cdsLayer]=\"1\"\n              [items]=\"obs.teamItems\"\n              [disabled]=\"obs.disabled\"\n              (selected)=\"onTeamSelect($event)\"\n              (clear)=\"onTeamClear()\"\n            >\n              <cds-dropdown-list onclick=\"event.stopPropagation()\"></cds-dropdown-list>\n            </cds-combo-box>\n\n            <button\n              cdsButton\n              [attr.data-carbon-theme]=\"toggletipTheme$ | async\"\n              class=\"submit-button\"\n              [disabled]=\"(!obs.selectedUserId && !obs.selectedTeamKey) || obs.disabled\"\n              (click)=\"onConfirm()\"\n            >\n              {{ 'assignment.confirm' | translate }}\n\n              <svg class=\"cds--btn__icon\" cdsIcon=\"user--follow\" size=\"16\"></svg>\n            </button>\n          </ng-container>\n\n          <ng-template #loadingTemplate>\n            <span class=\"loading-text\" [attr.data-carbon-theme]=\"toggletipTheme$ | async\">\n              {{ 'assignment.loading' | translate }}\n            </span>\n          </ng-template>\n        </div>\n      </cds-toggletip>\n    </div>\n  </ng-container>\n</ng-container>\n", styles: [":host ::ng-deep .cds--popover-content{max-inline-size:unset}.assignment-container{display:flex;align-items:center;justify-content:center;position:relative;font-weight:400;font-size:14px;line-height:18px;letter-spacing:.16px;color:var(--cds-link-01)}.assigned-display{display:flex;justify-content:flex-start;align-items:center;gap:8px;width:100%}.assignment-pill{display:inline-flex;align-items:center;gap:4px;min-width:0;max-width:calc(50% - 4px);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.assignment-pill:only-child{max-width:100%}.assignment-pill .pill-icon{flex-shrink:0;fill:currentColor}.assignment-pill .pill-text{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.element{opacity:0;visibility:hidden;position:absolute;width:100%;transition:opacity .3s ease-in-out}.element.active{opacity:1;visibility:visible}.element.main{position:relative;width:auto}.assignment-popover-content{width:400px;max-inline-size:400px;display:flex;flex-direction:column;gap:16px}.assignment-popover-content .cds--btn{width:100%;max-width:unset}.assign-button{width:250px}.click-to-edit-button{width:100%}.submit-button{width:100%;max-width:unset}.loading-text{font-size:14px;color:var(--cds-text-secondary)}\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: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$4.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1$4.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "pipe", type: i1$4.AsyncPipe, name: "async" }, { kind: "ngmodule", type: TranslateModule }, { kind: "pipe", type: i1.TranslatePipe, name: "translate" }, { kind: "ngmodule", type: ButtonModule }, { kind: "directive", type: i2$3.Button, selector: "[cdsButton], [ibmButton]", inputs: ["ibmButton", "cdsButton", "size", "skeleton", "iconOnly", "isExpressive"] }, { kind: "ngmodule", type: ToggletipModule }, { kind: "component", type: i2$3.Toggletip, selector: "cds-toggletip, ibm-toggletip", inputs: ["id", "isOpen"] }, { kind: "directive", type: i2$3.ToggletipButton, selector: "[cdsToggletipButton], [ibmToggletipButton]", inputs: ["ariaLabel"] }, { kind: "directive", type: i2$3.ToggletipContent, selector: "[cdsToggletipContent], [ibmToggletipContent]" }, { 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: LayerModule }, { kind: "directive", type: i2$3.LayerDirective, selector: "[cdsLayer], [ibmLayer]", inputs: ["ibmLayer", "cdsLayer"], exportAs: ["layer"] }, { kind: "ngmodule", type: ComboBoxModule }, { kind: "component", type: i2$3.ComboBox, selector: "cds-combo-box, ibm-combo-box", inputs: ["placeholder", "openMenuAria", "closeMenuAria", "clearSelectionsTitle", "clearSelectionsAria", "clearSelectionTitle", "clearSelectionAria", "id", "labelId", "items", "type", "size", "itemValueKey", "label", "hideLabel", "helperText", "appendInline", "invalid", "invalidText", "warn", "warnText", "maxLength", "theme", "selectionFeedback", "autocomplete", "dropUp", "disabled", "readonly", "fluid"], outputs: ["selected", "submit", "close", "search", "clear"] }, { kind: "component", type: i2$3.DropdownList, selector: "cds-dropdown-list, ibm-dropdown-list", inputs: ["ariaLabel", "items", "listTpl", "type", "showTitles"], outputs: ["select", "scroll", "blurIntent"] }, { kind: "directive", type: RemoveClassnamesDirective, selector: "[removeClassnames]", inputs: ["removeClassnames"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.20", ngImport: i0, type: AssignmentComponent, decorators: [{
             type: Component,
@@ -18193,7 +18414,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.20", ngImpo
                         ComboBoxModule,
                         RemoveClassnamesDirective,
                     ], 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-container\n  *ngIf=\"{\n    disabled: disabled$ | async,\n    loading: loading$ | async,\n    userItems: userItems$ | async,\n    teamItems: teamItems$ | async,\n    mouseIsOver: mouseIsOver$ | async,\n    selectedUserId: selectedUserId$ | async,\n    selectedTeamKey: selectedTeamKey$ | async,\n    editToggletipOpen: editToggletipOpen$ | async,\n    showUserComboBox: showUserComboBox$ | async,\n    showTeamComboBox: showTeamComboBox$ | async,\n  } as obs\"\n>\n  <ng-container *ngIf=\"isAssigned || hasPermission\">\n    <div\n      class=\"assignment-container\"\n      (mouseenter)=\"onMouseEnter()\"\n      (mouseleave)=\"onMouseLeave()\"\n    >\n      <!-- Assigned state: display pills with icons -->\n      <div\n        class=\"assigned-display element\"\n        [ngClass]=\"{\n          active: hasPermission\n            ? isAssigned && !obs.mouseIsOver && !obs.editToggletipOpen\n            : isAssigned,\n        }\"\n      >\n        <span class=\"assignment-pill\" *ngIf=\"_assignedTeamKey\">\n          <svg cdsIcon=\"group\" size=\"16\" class=\"pill-icon\"></svg>\n          <span class=\"pill-text\">{{ _assignedTeamTitle }}</span>\n        </span>\n\n        <span class=\"assignment-pill\" *ngIf=\"_assigneeId\">\n          <svg cdsIcon=\"user\" size=\"16\" class=\"pill-icon\"></svg>\n          <span class=\"pill-text\">{{ _assigneeFullName || _assigneeId }}</span>\n        </span>\n      </div>\n\n      <!-- Click to edit button (appears on hover when assigned) -->\n      <cds-toggletip\n        *ngIf=\"hasPermission && isAssigned\"\n        align=\"bottom\"\n        class=\"element\"\n        [autoAlign]=\"true\"\n        [isOpen]=\"open$ | async\"\n        [ngClass]=\"{active: isAssigned && (obs.mouseIsOver || obs.editToggletipOpen)}\"\n        (onOpen)=\"onOpenEditToggletip()\"\n        (onClose)=\"onCloseEditToggletip()\"\n      >\n        <button\n          cdsToggletipButton\n          [removeClassnames]=\"['cds--toggletip-button']\"\n          cdsButton=\"ghost\"\n          size=\"sm\"\n          class=\"click-to-edit-button\"\n        >\n          {{ 'assignment.clickToEdit' | translate }}\n        </button>\n\n        <div cdsToggletipContent class=\"assignment-popover-content\">\n          <cds-combo-box\n            *ngIf=\"obs.showUserComboBox && obs.userItems?.length > 0\"\n            [attr.data-carbon-theme]=\"toggletipDropdownTheme$ | async\"\n            [label]=\"'assignment.selectUser' | translate\"\n            [placeholder]=\"'assignment.selectUser' | translate\"\n            [appendInline]=\"true\"\n            [dropUp]=\"false\"\n            [cdsLayer]=\"1\"\n            [items]=\"obs.userItems\"\n            [disabled]=\"obs.disabled\"\n            itemValueKey=\"id\"\n            (selected)=\"onUserSelect($event)\"\n            (clear)=\"onUserClear()\"\n          >\n            <cds-dropdown-list onclick=\"event.stopPropagation()\"></cds-dropdown-list>\n          </cds-combo-box>\n\n          <cds-combo-box\n            *ngIf=\"obs.showTeamComboBox && obs.teamItems?.length > 0\"\n            [attr.data-carbon-theme]=\"toggletipDropdownTheme$ | async\"\n            [label]=\"'assignment.selectTeam' | translate\"\n            [placeholder]=\"'assignment.selectTeam' | translate\"\n            [appendInline]=\"true\"\n            [dropUp]=\"false\"\n            [cdsLayer]=\"1\"\n            [items]=\"obs.teamItems\"\n            [disabled]=\"obs.disabled\"\n            itemValueKey=\"id\"\n            (selected)=\"onTeamSelect($event)\"\n            (clear)=\"onTeamClear()\"\n          >\n            <cds-dropdown-list onclick=\"event.stopPropagation()\"></cds-dropdown-list>\n          </cds-combo-box>\n\n          <button\n            cdsButton\n            [attr.data-carbon-theme]=\"toggletipTheme$ | async\"\n            [cdsLayer]=\"1\"\n            class=\"submit-button\"\n            [disabled]=\"!hasEditChanges || obs.disabled\"\n            (click)=\"onUpdate()\"\n          >\n            {{ 'assignment.update' | translate }}\n          </button>\n\n          <button\n            cdsButton=\"danger--tertiary\"\n            [cdsLayer]=\"1\"\n            [attr.data-carbon-theme]=\"toggletipTheme$ | async\"\n            [disabled]=\"obs.disabled\"\n            (click)=\"onUnassign()\"\n          >\n            {{ 'assignment.unassignAll' | translate }}\n          </button>\n        </div>\n      </cds-toggletip>\n\n      <!-- Assign button: always rendered for layout sizing (position: relative via .main).\n           When hasPermission is false it stays hidden and non-interactive. -->\n      <cds-toggletip\n        align=\"bottom\"\n        class=\"element main\"\n        [autoAlign]=\"true\"\n        [isOpen]=\"open$ | async\"\n        [ngClass]=\"{active: hasPermission && !isAssigned}\"\n        (onOpen)=\"onOpenAssignToggletip()\"\n      >\n        <button\n          cdsToggletipButton\n          [removeClassnames]=\"['cds--toggletip-button']\"\n          cdsButton=\"tertiary\"\n          size=\"sm\"\n          class=\"assign-button\"\n        >\n          <svg class=\"cds--btn__icon\" cdsIcon=\"user--follow\" size=\"16\"></svg>\n\n          {{ assignButtonTranslationKey | translate }}\n        </button>\n\n        <div cdsToggletipContent class=\"assignment-popover-content\">\n          <ng-container *ngIf=\"!obs.loading; else loadingTemplate\">\n            <cds-combo-box\n              *ngIf=\"obs.showUserComboBox && obs.userItems?.length > 0\"\n              [attr.data-carbon-theme]=\"toggletipDropdownTheme$ | async\"\n              [label]=\"'assignment.selectUser' | translate\"\n              [placeholder]=\"'assignment.selectUser' | translate\"\n              [appendInline]=\"true\"\n              [dropUp]=\"false\"\n              [cdsLayer]=\"1\"\n              [items]=\"obs.userItems\"\n              [disabled]=\"obs.disabled\"\n              (selected)=\"onUserSelect($event)\"\n              (clear)=\"onUserClear()\"\n            >\n              <cds-dropdown-list onclick=\"event.stopPropagation()\"></cds-dropdown-list>\n            </cds-combo-box>\n\n            <cds-combo-box\n              *ngIf=\"obs.showTeamComboBox && obs.teamItems?.length > 0\"\n              [attr.data-carbon-theme]=\"toggletipDropdownTheme$ | async\"\n              [label]=\"'assignment.selectTeam' | translate\"\n              [placeholder]=\"'assignment.selectTeam' | translate\"\n              [appendInline]=\"true\"\n              [dropUp]=\"false\"\n              [cdsLayer]=\"1\"\n              [items]=\"obs.teamItems\"\n              [disabled]=\"obs.disabled\"\n              (selected)=\"onTeamSelect($event)\"\n              (clear)=\"onTeamClear()\"\n            >\n              <cds-dropdown-list onclick=\"event.stopPropagation()\"></cds-dropdown-list>\n            </cds-combo-box>\n\n            <button\n              cdsButton\n              [attr.data-carbon-theme]=\"toggletipTheme$ | async\"\n              class=\"submit-button\"\n              [disabled]=\"(!obs.selectedUserId && !obs.selectedTeamKey) || obs.disabled\"\n              (click)=\"onConfirm()\"\n            >\n              {{ 'assignment.confirm' | translate }}\n\n              <svg class=\"cds--btn__icon\" cdsIcon=\"user--follow\" size=\"16\"></svg>\n            </button>\n          </ng-container>\n\n          <ng-template #loadingTemplate>\n            <span class=\"loading-text\" [attr.data-carbon-theme]=\"toggletipTheme$ | async\">\n              {{ 'assignment.loading' | translate }}\n            </span>\n          </ng-template>\n        </div>\n      </cds-toggletip>\n    </div>\n  </ng-container>\n</ng-container>\n", styles: [":host ::ng-deep .cds--popover-content{max-inline-size:unset}.assignment-container{display:flex;align-items:center;justify-content:center;position:relative;font-weight:400;font-size:14px;line-height:18px;letter-spacing:.16px;color:var(--cds-link-01)}.assigned-display{display:flex;justify-content:flex-start;align-items:center;gap:8px;width:100%}.assignment-pill{display:inline-flex;align-items:center;gap:4px;min-width:0;max-width:calc(50% - 4px);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.assignment-pill:only-child{max-width:100%}.assignment-pill .pill-icon{flex-shrink:0;fill:currentColor}.assignment-pill .pill-text{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.element{opacity:0;visibility:hidden;position:absolute;width:100%;transition:opacity .3s ease-in-out}.element.active{opacity:1;visibility:visible}.element.main{position:relative;width:auto}.assignment-popover-content{width:400px;max-inline-size:400px;display:flex;flex-direction:column;gap:16px}.assignment-popover-content .cds--btn{width:100%;max-width:unset}.assign-button{width:250px}.click-to-edit-button{width:100%}.submit-button{width:100%;max-width:unset}.loading-text{font-size:14px;color:var(--cds-text-secondary)}\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: CdsThemeService }, { type: i2$2.IconService }, { type: i1.TranslateService }, { type: i6.UserProviderService }], propDecorators: { hostDisplay: [{
+        }], ctorParameters: () => [{ type: CdsThemeService }, { type: i2$3.IconService }, { type: i1.TranslateService }, { type: i6$1.UserProviderService }], propDecorators: { hostDisplay: [{
                 type: HostBinding,
                 args: ['style.display']
             }], mode: [{
@@ -18218,6 +18439,218 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.20", ngImpo
                 type: Output
             }] } });
 
+/*
+ * 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.
+ * You may obtain a copy of the License at
+ *
+ * https://joinup.ec.europa.eu/collection/eupl/eupl-text-eupl-12
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" basis,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+class ColorPickerComponent {
+    constructor(cdsThemeService) {
+        this.cdsThemeService = cdsThemeService;
+        this.labelTranslationKey = 'colorPicker.label';
+        this.config = {};
+        this.i18n = null;
+        this.colorChangeEvent = new EventEmitter();
+        this.clearEvent = new EventEmitter();
+        this.$disabled = signal(false);
+        this.testIds = COLOR_PICKER_TEST_IDS;
+        this._pickr = null;
+        this._value = null;
+        this._initialized = false;
+        this._subscription = new Subscription();
+        this._onChangeFn = () => { };
+        this._onTouchedFn = () => { };
+    }
+    ngAfterViewInit() {
+        this._initPickr();
+        this._subscription.add(this.cdsThemeService.currentTheme$.subscribe(theme => {
+            this._applyThemeToPickr(theme);
+        }));
+    }
+    ngOnChanges(changes) {
+        if (changes['i18n'] && !changes['i18n'].firstChange && this._initialized) {
+            this._reinitPickr();
+        }
+    }
+    ngOnDestroy() {
+        this._subscription.unsubscribe();
+        this._destroyPickr();
+    }
+    writeValue(value) {
+        this._value = value || null;
+        if (this._pickr && this._initialized) {
+            if (value) {
+                this._pickr.setColor(value);
+            }
+        }
+    }
+    registerOnChange(fn) {
+        this._onChangeFn = fn;
+    }
+    registerOnTouched(fn) {
+        this._onTouchedFn = fn;
+    }
+    setDisabledState(disabled) {
+        this.$disabled.set(disabled);
+        if (this._pickr) {
+            if (disabled) {
+                this._pickr.disable();
+            }
+            else {
+                this._pickr.enable();
+            }
+        }
+    }
+    _initPickr() {
+        const defaultSwatches = [
+            '#000000',
+            '#ffffff',
+            '#f44336',
+            '#e91e63',
+            '#9c27b0',
+            '#673ab7',
+            '#3f51b5',
+            '#2196f3',
+            '#03a9f4',
+            '#00bcd4',
+            '#009688',
+            '#4caf50',
+            '#8bc34a',
+            '#cddc39',
+            '#ffeb3b',
+            '#ffc107',
+            '#ff9800',
+            '#ff5722',
+        ];
+        this._pickr = Pickr.create({
+            el: this.pickrAnchorRef.nativeElement,
+            theme: 'monolith',
+            default: this._value || '#000000',
+            container: 'body',
+            appClass: 'valtimo-pickr',
+            position: this.config.position || 'bottom-start',
+            inline: this.config.inline || false,
+            showAlways: this.config.showAlways || false,
+            closeOnScroll: this.config.closeOnScroll ?? true,
+            lockOpacity: this.config.lockOpacity || false,
+            swatches: this.config.swatches ?? defaultSwatches,
+            defaultRepresentation: this.config.defaultRepresentation || 'HEXA',
+            components: {
+                preview: true,
+                opacity: this.config.opacity ?? true,
+                hue: true,
+                interaction: {
+                    hex: true,
+                    rgba: true,
+                    hsla: false,
+                    input: true,
+                    clear: true,
+                    save: true,
+                },
+            },
+            i18n: {
+                'btn:save': this.i18n?.save || 'OK',
+                'btn:cancel': this.i18n?.cancel || 'Cancel',
+                'btn:clear': this.i18n?.clear || 'Clear',
+            },
+        });
+        this._pickr.on('init', () => {
+            this._initialized = true;
+        });
+        this._pickr.on('save', (color) => {
+            const hex = color ? color.toHEXA().toString() : null;
+            this._value = hex;
+            this._onChangeFn(hex);
+            this.colorChangeEvent.emit(hex || '');
+            this._pickr?.hide();
+        });
+        this._pickr.on('clear', () => {
+            this._value = null;
+            this._onChangeFn(null);
+            this.colorChangeEvent.emit('');
+            this.clearEvent.emit();
+        });
+        this._pickr.on('hide', () => {
+            this._onTouchedFn();
+        });
+    }
+    _reinitPickr() {
+        // Pickr.create() replaces the target element via parentElement.replaceChild().
+        // After destroyAndRemove() the replaced element is gone, so we must insert a
+        // fresh anchor into the stable container for the next Pickr.create() call.
+        if (this._pickr) {
+            this._pickr.destroyAndRemove();
+            this._pickr = null;
+            this._initialized = false;
+        }
+        const container = this.pickrContainerRef.nativeElement;
+        const anchor = document.createElement('div');
+        container.innerHTML = '';
+        container.appendChild(anchor);
+        this.pickrAnchorRef.nativeElement = anchor;
+        this._initPickr();
+    }
+    _destroyPickr() {
+        if (this._pickr) {
+            this._pickr.destroyAndRemove();
+            this._pickr = null;
+            this._initialized = false;
+        }
+    }
+    _applyThemeToPickr(theme) {
+        const isDark = theme === CurrentCarbonTheme.G90 || theme === CurrentCarbonTheme.G100;
+        const pickrApp = document.querySelector('.valtimo-pickr .pcr-app');
+        if (pickrApp) {
+            pickrApp.classList.toggle('valtimo-pickr--dark', isDark);
+            pickrApp.classList.toggle('valtimo-pickr--light', !isDark);
+        }
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.20", ngImport: i0, type: ColorPickerComponent, deps: [{ token: CdsThemeService }], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.20", type: ColorPickerComponent, isStandalone: true, selector: "valtimo-color-picker", inputs: { labelTranslationKey: "labelTranslationKey", config: "config", i18n: "i18n" }, outputs: { colorChangeEvent: "colorChangeEvent", clearEvent: "clearEvent" }, providers: [
+            {
+                provide: NG_VALUE_ACCESSOR,
+                useExisting: forwardRef(() => ColorPickerComponent),
+                multi: true,
+            },
+        ], viewQueries: [{ propertyName: "pickrContainerRef", first: true, predicate: ["pickrContainer"], descendants: true, static: true }, { propertyName: "pickrAnchorRef", first: true, predicate: ["pickrAnchor"], descendants: true, static: true }], usesOnChanges: 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<cds-label [attr.data-test-id]=\"testIds.label\">\n  {{ labelTranslationKey | translate }}\n\n  <div #pickrContainer class=\"valtimo-color-picker\" [attr.data-test-id]=\"testIds.container\">\n    <div #pickrAnchor [attr.data-test-id]=\"testIds.trigger\"></div>\n  </div>\n</cds-label>\n", styles: [".pickr{position:relative;overflow:visible;transform:translateY(0)}.pickr *{box-sizing:border-box;outline:none;border:none;-webkit-appearance:none}.pickr .pcr-button{position:relative;height:2em;width:2em;padding:.5em;cursor:pointer;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica Neue,Arial,sans-serif;border-radius:.15em;background:url('data:image/svg+xml;utf8, <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 50 50\" stroke=\"%2342445A\" stroke-width=\"5px\" stroke-linecap=\"round\"><path d=\"M45,45L5,5\"></path><path d=\"M45,5L5,45\"></path></svg>') no-repeat center;background-size:0;transition:all .3s}.pickr .pcr-button:before{position:absolute;content:\"\";top:0;left:0;width:100%;height:100%;background:url('data:image/svg+xml;utf8, <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 2 2\"><path fill=\"white\" d=\"M1,0H2V1H1V0ZM0,1H1V2H0V1Z\"/><path fill=\"gray\" d=\"M0,0H1V1H0V0ZM1,1H2V2H1V1Z\"/></svg>');background-size:.5em;border-radius:.15em;z-index:-1}.pickr .pcr-button:before{z-index:initial}.pickr .pcr-button:after{position:absolute;content:\"\";top:0;left:0;height:100%;width:100%;transition:background .3s;background:var(--pcr-color);border-radius:.15em}.pickr .pcr-button.clear{background-size:70%}.pickr .pcr-button.clear:before{opacity:0}.pickr .pcr-button.clear:focus{box-shadow:0 0 0 1px #ffffffd9,0 0 0 3px var(--pcr-color)}.pickr .pcr-button.disabled{cursor:not-allowed}.pickr *,.pcr-app *{box-sizing:border-box;outline:none;border:none;-webkit-appearance:none}.pickr input:focus,.pickr input.pcr-active,.pickr button:focus,.pickr button.pcr-active,.pcr-app input:focus,.pcr-app input.pcr-active,.pcr-app button:focus,.pcr-app button.pcr-active{box-shadow:0 0 0 1px #ffffffd9,0 0 0 3px var(--pcr-color)}.pickr .pcr-palette,.pickr .pcr-slider,.pcr-app .pcr-palette,.pcr-app .pcr-slider{transition:box-shadow .3s}.pickr .pcr-palette:focus,.pickr .pcr-slider:focus,.pcr-app .pcr-palette:focus,.pcr-app .pcr-slider:focus{box-shadow:0 0 0 1px #ffffffd9,0 0 0 3px #00000040}.pcr-app{position:fixed;display:flex;flex-direction:column;z-index:10000;border-radius:.1em;background:#fff;opacity:0;visibility:hidden;transition:opacity .3s,visibility 0s .3s;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica Neue,Arial,sans-serif;box-shadow:0 .15em 1.5em #0000001a,0 0 1em #00000008;left:0;top:0}.pcr-app.visible{transition:opacity .3s;visibility:visible;opacity:1}.pcr-app .pcr-swatches{display:flex;flex-wrap:wrap;margin-top:.75em}.pcr-app .pcr-swatches.pcr-last{margin:0}@supports (display: grid){.pcr-app .pcr-swatches{display:grid;align-items:center;grid-template-columns:repeat(auto-fit,1.75em)}}.pcr-app .pcr-swatches>button{font-size:1em;position:relative;width:calc(1.75em - 5px);height:calc(1.75em - 5px);border-radius:.15em;cursor:pointer;margin:2.5px;flex-shrink:0;justify-self:center;transition:all .15s;overflow:hidden;background:#0000;z-index:1}.pcr-app .pcr-swatches>button:before{position:absolute;content:\"\";top:0;left:0;width:100%;height:100%;background:url('data:image/svg+xml;utf8, <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 2 2\"><path fill=\"white\" d=\"M1,0H2V1H1V0ZM0,1H1V2H0V1Z\"/><path fill=\"gray\" d=\"M0,0H1V1H0V0ZM1,1H2V2H1V1Z\"/></svg>');background-size:6px;border-radius:.15em;z-index:-1}.pcr-app .pcr-swatches>button:after{content:\"\";position:absolute;top:0;left:0;width:100%;height:100%;background:var(--pcr-color);border:1px solid rgba(0,0,0,.05);border-radius:.15em;box-sizing:border-box}.pcr-app .pcr-swatches>button:hover{filter:brightness(1.05)}.pcr-app .pcr-swatches>button:not(.pcr-active){box-shadow:none}.pcr-app .pcr-interaction{display:flex;flex-wrap:wrap;align-items:center;margin:0 -.2em}.pcr-app .pcr-interaction>*{margin:0 .2em}.pcr-app .pcr-interaction input{letter-spacing:.07em;font-size:.75em;text-align:center;cursor:pointer;color:#75797e;background:#f1f3f4;border-radius:.15em;transition:all .15s;padding:.45em .5em;margin-top:.75em}.pcr-app .pcr-interaction input:hover{filter:brightness(.975)}.pcr-app .pcr-interaction input:focus{box-shadow:0 0 0 1px #ffffffd9,0 0 0 3px #4285f4bf}.pcr-app .pcr-interaction .pcr-result{color:#75797e;text-align:left;flex:1 1 8em;min-width:8em;transition:all .2s;border-radius:.15em;background:#f1f3f4;cursor:text}.pcr-app .pcr-interaction .pcr-result::-moz-selection{background:#4285f4;color:#fff}.pcr-app .pcr-interaction .pcr-result::selection{background:#4285f4;color:#fff}.pcr-app .pcr-interaction .pcr-type.active{color:#fff;background:#4285f4}.pcr-app .pcr-interaction .pcr-save,.pcr-app .pcr-interaction .pcr-cancel,.pcr-app .pcr-interaction .pcr-clear{color:#fff;width:auto}.pcr-app .pcr-interaction .pcr-save,.pcr-app .pcr-interaction .pcr-cancel,.pcr-app .pcr-interaction .pcr-clear{color:#fff}.pcr-app .pcr-interaction .pcr-save:hover,.pcr-app .pcr-interaction .pcr-cancel:hover,.pcr-app .pcr-interaction .pcr-clear:hover{filter:brightness(.925)}.pcr-app .pcr-interaction .pcr-save{background:#4285f4}.pcr-app .pcr-interaction .pcr-clear,.pcr-app .pcr-interaction .pcr-cancel{background:#f44250}.pcr-app .pcr-interaction .pcr-clear:focus,.pcr-app .pcr-interaction .pcr-cancel:focus{box-shadow:0 0 0 1px #ffffffd9,0 0 0 3px #f44250bf}.pcr-app .pcr-selection .pcr-picker{position:absolute;height:18px;width:18px;border:2px solid #fff;border-radius:100%;-webkit-user-select:none;-moz-user-select:none;user-select:none}.pcr-app .pcr-selection .pcr-color-palette,.pcr-app .pcr-selection .pcr-color-chooser,.pcr-app .pcr-selection .pcr-color-opacity{position:relative;-webkit-user-select:none;-moz-user-select:none;user-select:none;display:flex;flex-direction:column;cursor:grab;cursor:-webkit-grab}.pcr-app .pcr-selection .pcr-color-palette:active,.pcr-app .pcr-selection .pcr-color-chooser:active,.pcr-app .pcr-selection .pcr-color-opacity:active{cursor:grabbing;cursor:-webkit-grabbing}.pcr-app[data-theme=monolith]{width:14.25em;max-width:95vw;padding:.8em}.pcr-app[data-theme=monolith] .pcr-selection{display:flex;flex-direction:column;justify-content:space-between;flex-grow:1}.pcr-app[data-theme=monolith] .pcr-selection .pcr-color-preview{position:relative;z-index:1;width:100%;height:1em;display:flex;flex-direction:row;justify-content:space-between;margin-bottom:.5em}.pcr-app[data-theme=monolith] .pcr-selection .pcr-color-preview:before{position:absolute;content:\"\";top:0;left:0;width:100%;height:100%;background:url('data:image/svg+xml;utf8, <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 2 2\"><path fill=\"white\" d=\"M1,0H2V1H1V0ZM0,1H1V2H0V1Z\"/><path fill=\"gray\" d=\"M0,0H1V1H0V0ZM1,1H2V2H1V1Z\"/></svg>');background-size:.5em;border-radius:.15em;z-index:-1}.pcr-app[data-theme=monolith] .pcr-selection .pcr-color-preview .pcr-last-color{cursor:pointer;transition:background-color .3s,box-shadow .3s;border-radius:.15em 0 0 .15em;z-index:2}.pcr-app[data-theme=monolith] .pcr-selection .pcr-color-preview .pcr-current-color{border-radius:0 .15em .15em 0}.pcr-app[data-theme=monolith] .pcr-selection .pcr-color-preview .pcr-last-color,.pcr-app[data-theme=monolith] .pcr-selection .pcr-color-preview .pcr-current-color{background:var(--pcr-color);width:50%;height:100%}.pcr-app[data-theme=monolith] .pcr-selection .pcr-color-palette{width:100%;height:8em;z-index:1}.pcr-app[data-theme=monolith] .pcr-selection .pcr-color-palette .pcr-palette{border-radius:.15em;width:100%;height:100%}.pcr-app[data-theme=monolith] .pcr-selection .pcr-color-palette .pcr-palette:before{position:absolute;content:\"\";top:0;left:0;width:100%;height:100%;background:url('data:image/svg+xml;utf8, <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 2 2\"><path fill=\"white\" d=\"M1,0H2V1H1V0ZM0,1H1V2H0V1Z\"/><path fill=\"gray\" d=\"M0,0H1V1H0V0ZM1,1H2V2H1V1Z\"/></svg>');background-size:.5em;border-radius:.15em;z-index:-1}.pcr-app[data-theme=monolith] .pcr-selection .pcr-color-chooser,.pcr-app[data-theme=monolith] .pcr-selection .pcr-color-opacity{height:.5em;margin-top:.75em}.pcr-app[data-theme=monolith] .pcr-selection .pcr-color-chooser .pcr-picker,.pcr-app[data-theme=monolith] .pcr-selection .pcr-color-opacity .pcr-picker{top:50%;transform:translateY(-50%)}.pcr-app[data-theme=monolith] .pcr-selection .pcr-color-chooser .pcr-slider,.pcr-app[data-theme=monolith] .pcr-selection .pcr-color-opacity .pcr-slider{flex-grow:1;border-radius:50em}.pcr-app[data-theme=monolith] .pcr-selection .pcr-color-chooser .pcr-slider{background:linear-gradient(to right,red,#ff0,#0f0,#0ff,#00f,#f0f,red)}.pcr-app[data-theme=monolith] .pcr-selection .pcr-color-opacity .pcr-slider{background:linear-gradient(to right,transparent,black),url('data:image/svg+xml;utf8, <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 2 2\"><path fill=\"white\" d=\"M1,0H2V1H1V0ZM0,1H1V2H0V1Z\"/><path fill=\"gray\" d=\"M0,0H1V1H0V0ZM1,1H2V2H1V1Z\"/></svg>');background-size:100%,.25em}.valtimo-color-picker{display:inline-block}.valtimo-pickr .pcr-button{width:32px;height:32px;border-radius:0;border:1px solid var(--cds-border-strong);cursor:pointer;transition:border-color 70ms cubic-bezier(.2,0,.38,.9)}.valtimo-pickr .pcr-button:hover{border-color:var(--cds-border-inverse)}.valtimo-pickr .pcr-button:focus{outline:2px solid var(--cds-focus);outline-offset:1px}.valtimo-pickr .pcr-button:after{border-radius:0}.valtimo-pickr .pcr-button:before{border-radius:0}.valtimo-pickr .pcr-app{border-radius:0;box-shadow:0 2px 6px #0003;font-family:IBM Plex Sans,Helvetica Neue,Arial,sans-serif;font-size:.875rem;background:var(--cds-layer);color:var(--cds-text-primary);border:1px solid var(--cds-border-subtle)}.valtimo-pickr .pcr-app .pcr-selection .pcr-color-preview .pcr-last-color,.valtimo-pickr .pcr-app .pcr-selection .pcr-color-preview .pcr-current-color{border-radius:0;border:1px solid var(--cds-border-subtle)}.valtimo-pickr .pcr-app .pcr-selection .pcr-color-chooser .pcr-slider,.valtimo-pickr .pcr-app .pcr-selection .pcr-color-opacity .pcr-slider{border-radius:0}.valtimo-pickr .pcr-app .pcr-selection .pcr-color-chooser .pcr-picker,.valtimo-pickr .pcr-app .pcr-selection .pcr-color-opacity .pcr-picker{border:2px solid var(--cds-icon-primary);border-radius:50%;background:transparent}.valtimo-pickr .pcr-app .pcr-selection .pcr-color-palette .pcr-palette{border-radius:0;border:1px solid var(--cds-border-subtle)}.valtimo-pickr .pcr-app .pcr-selection .pcr-color-palette .pcr-palette .pcr-picker{border:2px solid var(--cds-icon-primary);border-radius:50%;background:transparent}.valtimo-pickr .pcr-app .pcr-swatches>button{border-radius:0;border:1px solid var(--cds-border-subtle);transition:border-color 70ms cubic-bezier(.2,0,.38,.9)}.valtimo-pickr .pcr-app .pcr-swatches>button:hover{border-color:var(--cds-border-inverse)}.valtimo-pickr .pcr-app .pcr-swatches>button:focus{outline:2px solid var(--cds-focus);outline-offset:1px}.valtimo-pickr .pcr-app .pcr-interaction input{background:var(--cds-field);color:var(--cds-text-primary);border:none;border-bottom:1px solid var(--cds-border-strong);border-radius:0;font-family:IBM Plex Mono,monospace;font-size:.875rem;padding:0 1rem;height:2rem;transition:border-color 70ms cubic-bezier(.2,0,.38,.9),outline 70ms cubic-bezier(.2,0,.38,.9)}.valtimo-pickr .pcr-app .pcr-interaction input:hover{border-bottom-color:var(--cds-border-inverse)}.valtimo-pickr .pcr-app .pcr-interaction input:focus{outline:2px solid var(--cds-focus);outline-offset:-2px;border-bottom-color:var(--cds-focus)}.valtimo-pickr .pcr-app .pcr-interaction .pcr-type{background:var(--cds-button-tertiary);color:var(--cds-text-on-color);border:none;border-radius:0;font-family:IBM Plex Sans,Helvetica Neue,Arial,sans-serif;font-size:.75rem;font-weight:600;letter-spacing:.32px;height:2rem;padding:0 1rem;cursor:pointer;transition:background-color 70ms cubic-bezier(.2,0,.38,.9)}.valtimo-pickr .pcr-app .pcr-interaction .pcr-type:hover{background:var(--cds-button-tertiary-hover)}.valtimo-pickr .pcr-app .pcr-interaction .pcr-type:focus{outline:2px solid var(--cds-focus);outline-offset:-2px}.valtimo-pickr .pcr-app .pcr-interaction .pcr-save{background:var(--cds-button-primary);color:var(--cds-text-on-color);border:none;border-radius:0;font-family:IBM Plex Sans,Helvetica Neue,Arial,sans-serif;font-size:.875rem;font-weight:400;letter-spacing:.16px;height:2rem;padding:0 1rem;cursor:pointer;transition:background-color 70ms cubic-bezier(.2,0,.38,.9)}.valtimo-pickr .pcr-app .pcr-interaction .pcr-save:hover{background:var(--cds-button-primary-hover)}.valtimo-pickr .pcr-app .pcr-interaction .pcr-save:focus{outline:2px solid var(--cds-focus);outline-offset:-2px}.valtimo-pickr .pcr-app .pcr-interaction .pcr-clear{background:var(--cds-button-danger-primary);color:var(--cds-text-on-color);border:none;border-radius:0;font-family:IBM Plex Sans,Helvetica Neue,Arial,sans-serif;font-size:.875rem;font-weight:400;letter-spacing:.16px;height:2rem;padding:0 1rem;cursor:pointer;transition:background-color 70ms cubic-bezier(.2,0,.38,.9)}.valtimo-pickr .pcr-app .pcr-interaction .pcr-clear:hover{background:var(--cds-button-danger-hover)}.valtimo-pickr .pcr-app .pcr-interaction .pcr-clear:focus{outline:2px solid var(--cds-focus);outline-offset:-2px}.valtimo-pickr .pcr-app.valtimo-pickr--dark{box-shadow:0 2px 6px #0009}\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/*! Bundled license information:\n\n@simonwep/pickr/dist/themes/monolith.min.css:\n  (*! Pickr 1.9.1 MIT | https://github.com/Simonwep/pickr *)\n*/\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: TranslateModule }, { kind: "pipe", type: i1.TranslatePipe, name: "translate" }, { kind: "ngmodule", type: InputModule$1 }, { kind: "component", type: i2$3.Label, selector: "cds-label, ibm-label", inputs: ["labelInputID", "disabled", "skeleton", "helperText", "invalidText", "invalid", "warn", "warnText", "ariaLabel"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.20", ngImport: i0, type: ColorPickerComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'valtimo-color-picker', standalone: true, changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, imports: [CommonModule, TranslateModule, InputModule$1], providers: [
+                        {
+                            provide: NG_VALUE_ACCESSOR,
+                            useExisting: forwardRef(() => ColorPickerComponent),
+                            multi: true,
+                        },
+                    ], 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<cds-label [attr.data-test-id]=\"testIds.label\">\n  {{ labelTranslationKey | translate }}\n\n  <div #pickrContainer class=\"valtimo-color-picker\" [attr.data-test-id]=\"testIds.container\">\n    <div #pickrAnchor [attr.data-test-id]=\"testIds.trigger\"></div>\n  </div>\n</cds-label>\n", styles: [".pickr{position:relative;overflow:visible;transform:translateY(0)}.pickr *{box-sizing:border-box;outline:none;border:none;-webkit-appearance:none}.pickr .pcr-button{position:relative;height:2em;width:2em;padding:.5em;cursor:pointer;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica Neue,Arial,sans-serif;border-radius:.15em;background:url('data:image/svg+xml;utf8, <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 50 50\" stroke=\"%2342445A\" stroke-width=\"5px\" stroke-linecap=\"round\"><path d=\"M45,45L5,5\"></path><path d=\"M45,5L5,45\"></path></svg>') no-repeat center;background-size:0;transition:all .3s}.pickr .pcr-button:before{position:absolute;content:\"\";top:0;left:0;width:100%;height:100%;background:url('data:image/svg+xml;utf8, <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 2 2\"><path fill=\"white\" d=\"M1,0H2V1H1V0ZM0,1H1V2H0V1Z\"/><path fill=\"gray\" d=\"M0,0H1V1H0V0ZM1,1H2V2H1V1Z\"/></svg>');background-size:.5em;border-radius:.15em;z-index:-1}.pickr .pcr-button:before{z-index:initial}.pickr .pcr-button:after{position:absolute;content:\"\";top:0;left:0;height:100%;width:100%;transition:background .3s;background:var(--pcr-color);border-radius:.15em}.pickr .pcr-button.clear{background-size:70%}.pickr .pcr-button.clear:before{opacity:0}.pickr .pcr-button.clear:focus{box-shadow:0 0 0 1px #ffffffd9,0 0 0 3px var(--pcr-color)}.pickr .pcr-button.disabled{cursor:not-allowed}.pickr *,.pcr-app *{box-sizing:border-box;outline:none;border:none;-webkit-appearance:none}.pickr input:focus,.pickr input.pcr-active,.pickr button:focus,.pickr button.pcr-active,.pcr-app input:focus,.pcr-app input.pcr-active,.pcr-app button:focus,.pcr-app button.pcr-active{box-shadow:0 0 0 1px #ffffffd9,0 0 0 3px var(--pcr-color)}.pickr .pcr-palette,.pickr .pcr-slider,.pcr-app .pcr-palette,.pcr-app .pcr-slider{transition:box-shadow .3s}.pickr .pcr-palette:focus,.pickr .pcr-slider:focus,.pcr-app .pcr-palette:focus,.pcr-app .pcr-slider:focus{box-shadow:0 0 0 1px #ffffffd9,0 0 0 3px #00000040}.pcr-app{position:fixed;display:flex;flex-direction:column;z-index:10000;border-radius:.1em;background:#fff;opacity:0;visibility:hidden;transition:opacity .3s,visibility 0s .3s;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica Neue,Arial,sans-serif;box-shadow:0 .15em 1.5em #0000001a,0 0 1em #00000008;left:0;top:0}.pcr-app.visible{transition:opacity .3s;visibility:visible;opacity:1}.pcr-app .pcr-swatches{display:flex;flex-wrap:wrap;margin-top:.75em}.pcr-app .pcr-swatches.pcr-last{margin:0}@supports (display: grid){.pcr-app .pcr-swatches{display:grid;align-items:center;grid-template-columns:repeat(auto-fit,1.75em)}}.pcr-app .pcr-swatches>button{font-size:1em;position:relative;width:calc(1.75em - 5px);height:calc(1.75em - 5px);border-radius:.15em;cursor:pointer;margin:2.5px;flex-shrink:0;justify-self:center;transition:all .15s;overflow:hidden;background:#0000;z-index:1}.pcr-app .pcr-swatches>button:before{position:absolute;content:\"\";top:0;left:0;width:100%;height:100%;background:url('data:image/svg+xml;utf8, <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 2 2\"><path fill=\"white\" d=\"M1,0H2V1H1V0ZM0,1H1V2H0V1Z\"/><path fill=\"gray\" d=\"M0,0H1V1H0V0ZM1,1H2V2H1V1Z\"/></svg>');background-size:6px;border-radius:.15em;z-index:-1}.pcr-app .pcr-swatches>button:after{content:\"\";position:absolute;top:0;left:0;width:100%;height:100%;background:var(--pcr-color);border:1px solid rgba(0,0,0,.05);border-radius:.15em;box-sizing:border-box}.pcr-app .pcr-swatches>button:hover{filter:brightness(1.05)}.pcr-app .pcr-swatches>button:not(.pcr-active){box-shadow:none}.pcr-app .pcr-interaction{display:flex;flex-wrap:wrap;align-items:center;margin:0 -.2em}.pcr-app .pcr-interaction>*{margin:0 .2em}.pcr-app .pcr-interaction input{letter-spacing:.07em;font-size:.75em;text-align:center;cursor:pointer;color:#75797e;background:#f1f3f4;border-radius:.15em;transition:all .15s;padding:.45em .5em;margin-top:.75em}.pcr-app .pcr-interaction input:hover{filter:brightness(.975)}.pcr-app .pcr-interaction input:focus{box-shadow:0 0 0 1px #ffffffd9,0 0 0 3px #4285f4bf}.pcr-app .pcr-interaction .pcr-result{color:#75797e;text-align:left;flex:1 1 8em;min-width:8em;transition:all .2s;border-radius:.15em;background:#f1f3f4;cursor:text}.pcr-app .pcr-interaction .pcr-result::-moz-selection{background:#4285f4;color:#fff}.pcr-app .pcr-interaction .pcr-result::selection{background:#4285f4;color:#fff}.pcr-app .pcr-interaction .pcr-type.active{color:#fff;background:#4285f4}.pcr-app .pcr-interaction .pcr-save,.pcr-app .pcr-interaction .pcr-cancel,.pcr-app .pcr-interaction .pcr-clear{color:#fff;width:auto}.pcr-app .pcr-interaction .pcr-save,.pcr-app .pcr-interaction .pcr-cancel,.pcr-app .pcr-interaction .pcr-clear{color:#fff}.pcr-app .pcr-interaction .pcr-save:hover,.pcr-app .pcr-interaction .pcr-cancel:hover,.pcr-app .pcr-interaction .pcr-clear:hover{filter:brightness(.925)}.pcr-app .pcr-interaction .pcr-save{background:#4285f4}.pcr-app .pcr-interaction .pcr-clear,.pcr-app .pcr-interaction .pcr-cancel{background:#f44250}.pcr-app .pcr-interaction .pcr-clear:focus,.pcr-app .pcr-interaction .pcr-cancel:focus{box-shadow:0 0 0 1px #ffffffd9,0 0 0 3px #f44250bf}.pcr-app .pcr-selection .pcr-picker{position:absolute;height:18px;width:18px;border:2px solid #fff;border-radius:100%;-webkit-user-select:none;-moz-user-select:none;user-select:none}.pcr-app .pcr-selection .pcr-color-palette,.pcr-app .pcr-selection .pcr-color-chooser,.pcr-app .pcr-selection .pcr-color-opacity{position:relative;-webkit-user-select:none;-moz-user-select:none;user-select:none;display:flex;flex-direction:column;cursor:grab;cursor:-webkit-grab}.pcr-app .pcr-selection .pcr-color-palette:active,.pcr-app .pcr-selection .pcr-color-chooser:active,.pcr-app .pcr-selection .pcr-color-opacity:active{cursor:grabbing;cursor:-webkit-grabbing}.pcr-app[data-theme=monolith]{width:14.25em;max-width:95vw;padding:.8em}.pcr-app[data-theme=monolith] .pcr-selection{display:flex;flex-direction:column;justify-content:space-between;flex-grow:1}.pcr-app[data-theme=monolith] .pcr-selection .pcr-color-preview{position:relative;z-index:1;width:100%;height:1em;display:flex;flex-direction:row;justify-content:space-between;margin-bottom:.5em}.pcr-app[data-theme=monolith] .pcr-selection .pcr-color-preview:before{position:absolute;content:\"\";top:0;left:0;width:100%;height:100%;background:url('data:image/svg+xml;utf8, <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 2 2\"><path fill=\"white\" d=\"M1,0H2V1H1V0ZM0,1H1V2H0V1Z\"/><path fill=\"gray\" d=\"M0,0H1V1H0V0ZM1,1H2V2H1V1Z\"/></svg>');background-size:.5em;border-radius:.15em;z-index:-1}.pcr-app[data-theme=monolith] .pcr-selection .pcr-color-preview .pcr-last-color{cursor:pointer;transition:background-color .3s,box-shadow .3s;border-radius:.15em 0 0 .15em;z-index:2}.pcr-app[data-theme=monolith] .pcr-selection .pcr-color-preview .pcr-current-color{border-radius:0 .15em .15em 0}.pcr-app[data-theme=monolith] .pcr-selection .pcr-color-preview .pcr-last-color,.pcr-app[data-theme=monolith] .pcr-selection .pcr-color-preview .pcr-current-color{background:var(--pcr-color);width:50%;height:100%}.pcr-app[data-theme=monolith] .pcr-selection .pcr-color-palette{width:100%;height:8em;z-index:1}.pcr-app[data-theme=monolith] .pcr-selection .pcr-color-palette .pcr-palette{border-radius:.15em;width:100%;height:100%}.pcr-app[data-theme=monolith] .pcr-selection .pcr-color-palette .pcr-palette:before{position:absolute;content:\"\";top:0;left:0;width:100%;height:100%;background:url('data:image/svg+xml;utf8, <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 2 2\"><path fill=\"white\" d=\"M1,0H2V1H1V0ZM0,1H1V2H0V1Z\"/><path fill=\"gray\" d=\"M0,0H1V1H0V0ZM1,1H2V2H1V1Z\"/></svg>');background-size:.5em;border-radius:.15em;z-index:-1}.pcr-app[data-theme=monolith] .pcr-selection .pcr-color-chooser,.pcr-app[data-theme=monolith] .pcr-selection .pcr-color-opacity{height:.5em;margin-top:.75em}.pcr-app[data-theme=monolith] .pcr-selection .pcr-color-chooser .pcr-picker,.pcr-app[data-theme=monolith] .pcr-selection .pcr-color-opacity .pcr-picker{top:50%;transform:translateY(-50%)}.pcr-app[data-theme=monolith] .pcr-selection .pcr-color-chooser .pcr-slider,.pcr-app[data-theme=monolith] .pcr-selection .pcr-color-opacity .pcr-slider{flex-grow:1;border-radius:50em}.pcr-app[data-theme=monolith] .pcr-selection .pcr-color-chooser .pcr-slider{background:linear-gradient(to right,red,#ff0,#0f0,#0ff,#00f,#f0f,red)}.pcr-app[data-theme=monolith] .pcr-selection .pcr-color-opacity .pcr-slider{background:linear-gradient(to right,transparent,black),url('data:image/svg+xml;utf8, <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 2 2\"><path fill=\"white\" d=\"M1,0H2V1H1V0ZM0,1H1V2H0V1Z\"/><path fill=\"gray\" d=\"M0,0H1V1H0V0ZM1,1H2V2H1V1Z\"/></svg>');background-size:100%,.25em}.valtimo-color-picker{display:inline-block}.valtimo-pickr .pcr-button{width:32px;height:32px;border-radius:0;border:1px solid var(--cds-border-strong);cursor:pointer;transition:border-color 70ms cubic-bezier(.2,0,.38,.9)}.valtimo-pickr .pcr-button:hover{border-color:var(--cds-border-inverse)}.valtimo-pickr .pcr-button:focus{outline:2px solid var(--cds-focus);outline-offset:1px}.valtimo-pickr .pcr-button:after{border-radius:0}.valtimo-pickr .pcr-button:before{border-radius:0}.valtimo-pickr .pcr-app{border-radius:0;box-shadow:0 2px 6px #0003;font-family:IBM Plex Sans,Helvetica Neue,Arial,sans-serif;font-size:.875rem;background:var(--cds-layer);color:var(--cds-text-primary);border:1px solid var(--cds-border-subtle)}.valtimo-pickr .pcr-app .pcr-selection .pcr-color-preview .pcr-last-color,.valtimo-pickr .pcr-app .pcr-selection .pcr-color-preview .pcr-current-color{border-radius:0;border:1px solid var(--cds-border-subtle)}.valtimo-pickr .pcr-app .pcr-selection .pcr-color-chooser .pcr-slider,.valtimo-pickr .pcr-app .pcr-selection .pcr-color-opacity .pcr-slider{border-radius:0}.valtimo-pickr .pcr-app .pcr-selection .pcr-color-chooser .pcr-picker,.valtimo-pickr .pcr-app .pcr-selection .pcr-color-opacity .pcr-picker{border:2px solid var(--cds-icon-primary);border-radius:50%;background:transparent}.valtimo-pickr .pcr-app .pcr-selection .pcr-color-palette .pcr-palette{border-radius:0;border:1px solid var(--cds-border-subtle)}.valtimo-pickr .pcr-app .pcr-selection .pcr-color-palette .pcr-palette .pcr-picker{border:2px solid var(--cds-icon-primary);border-radius:50%;background:transparent}.valtimo-pickr .pcr-app .pcr-swatches>button{border-radius:0;border:1px solid var(--cds-border-subtle);transition:border-color 70ms cubic-bezier(.2,0,.38,.9)}.valtimo-pickr .pcr-app .pcr-swatches>button:hover{border-color:var(--cds-border-inverse)}.valtimo-pickr .pcr-app .pcr-swatches>button:focus{outline:2px solid var(--cds-focus);outline-offset:1px}.valtimo-pickr .pcr-app .pcr-interaction input{background:var(--cds-field);color:var(--cds-text-primary);border:none;border-bottom:1px solid var(--cds-border-strong);border-radius:0;font-family:IBM Plex Mono,monospace;font-size:.875rem;padding:0 1rem;height:2rem;transition:border-color 70ms cubic-bezier(.2,0,.38,.9),outline 70ms cubic-bezier(.2,0,.38,.9)}.valtimo-pickr .pcr-app .pcr-interaction input:hover{border-bottom-color:var(--cds-border-inverse)}.valtimo-pickr .pcr-app .pcr-interaction input:focus{outline:2px solid var(--cds-focus);outline-offset:-2px;border-bottom-color:var(--cds-focus)}.valtimo-pickr .pcr-app .pcr-interaction .pcr-type{background:var(--cds-button-tertiary);color:var(--cds-text-on-color);border:none;border-radius:0;font-family:IBM Plex Sans,Helvetica Neue,Arial,sans-serif;font-size:.75rem;font-weight:600;letter-spacing:.32px;height:2rem;padding:0 1rem;cursor:pointer;transition:background-color 70ms cubic-bezier(.2,0,.38,.9)}.valtimo-pickr .pcr-app .pcr-interaction .pcr-type:hover{background:var(--cds-button-tertiary-hover)}.valtimo-pickr .pcr-app .pcr-interaction .pcr-type:focus{outline:2px solid var(--cds-focus);outline-offset:-2px}.valtimo-pickr .pcr-app .pcr-interaction .pcr-save{background:var(--cds-button-primary);color:var(--cds-text-on-color);border:none;border-radius:0;font-family:IBM Plex Sans,Helvetica Neue,Arial,sans-serif;font-size:.875rem;font-weight:400;letter-spacing:.16px;height:2rem;padding:0 1rem;cursor:pointer;transition:background-color 70ms cubic-bezier(.2,0,.38,.9)}.valtimo-pickr .pcr-app .pcr-interaction .pcr-save:hover{background:var(--cds-button-primary-hover)}.valtimo-pickr .pcr-app .pcr-interaction .pcr-save:focus{outline:2px solid var(--cds-focus);outline-offset:-2px}.valtimo-pickr .pcr-app .pcr-interaction .pcr-clear{background:var(--cds-button-danger-primary);color:var(--cds-text-on-color);border:none;border-radius:0;font-family:IBM Plex Sans,Helvetica Neue,Arial,sans-serif;font-size:.875rem;font-weight:400;letter-spacing:.16px;height:2rem;padding:0 1rem;cursor:pointer;transition:background-color 70ms cubic-bezier(.2,0,.38,.9)}.valtimo-pickr .pcr-app .pcr-interaction .pcr-clear:hover{background:var(--cds-button-danger-hover)}.valtimo-pickr .pcr-app .pcr-interaction .pcr-clear:focus{outline:2px solid var(--cds-focus);outline-offset:-2px}.valtimo-pickr .pcr-app.valtimo-pickr--dark{box-shadow:0 2px 6px #0009}\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/*! Bundled license information:\n\n@simonwep/pickr/dist/themes/monolith.min.css:\n  (*! Pickr 1.9.1 MIT | https://github.com/Simonwep/pickr *)\n*/\n"] }]
+        }], ctorParameters: () => [{ type: CdsThemeService }], propDecorators: { pickrContainerRef: [{
+                type: ViewChild,
+                args: ['pickrContainer', { static: true }]
+            }], pickrAnchorRef: [{
+                type: ViewChild,
+                args: ['pickrAnchor', { static: true }]
+            }], labelTranslationKey: [{
+                type: Input
+            }], config: [{
+                type: Input
+            }], i18n: [{
+                type: Input
+            }], colorChangeEvent: [{
+                type: Output
+            }], clearEvent: [{
+                type: Output
+            }] } });
+
 /*
  * Copyright 2015-2026 Ritense BV, the Netherlands.
  *
@@ -18241,5 +18674,5 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.20", ngImpo
  * Generated bundle index. Do not edit.
  */
 
-export { ARBITRARY_AMOUNT_VALUE_TEST_IDS, AUTO_KEY_INPUT_TEST_IDS, Alert, AlertComponent, AlertModule, AlertService, AlertType, AlertsOptionsImpl, AssignmentComponent, AutoKeyInputComponent, BOOLEAN_CONVERTER_VALUES, BpmnJsDiagramComponent, BpmnJsDiagramModule, BreadcrumbNavigationComponent, BreadcrumbNavigationModule, BreadcrumbService, CARBON_CONSTANTS, CARBON_THEME, CASES_WITHOUT_STATUS_KEY, CONFIRMATION_MODAL_TEST_IDS, CamundaFormComponent, CamundaFormModule, CarbonListComponent, CarbonListFilterPipe, CarbonListModule, CarbonMultiInputComponent, CarbonMultiInputModule, CarbonNoResultsComponent, CaseCountPipe, CaseTagsSelectorComponent, CdsThemeService, ChoiceFieldService, ComponentsPipesModule, ConfirmationModalComponent, ConfirmationModalModule, ContextMenuDirective, CtrlClickDirective, CurrentCarbonTheme, DEFAULT_LIST_TRANSLATIONS, DEFAULT_PAGINATION, DEFAULT_PAGINATOR_CONFIG, DataListComponent, DataListModule, DatePickerComponent, DatePickerModule, DateTimePickerComponent, DigitOnlyDirective, DropzoneComponent, DropzoneModule, EditorComponent, EditorModule, EllipsisPipe, ExpansionPanelComponent, ExpansionPanelModule, FieldAutoFocusDirective, FieldAutoFocusModule, FileSizeModule, FileSizePipe, FilterSidebarComponent, FilterSidebarModule, FitPageDirective, FormComponent, FormIoCurrencyComponent, FormIoCurrentUserComponent, FormIoDomService, FormIoIbanComponent, FormIoModule, FormIoStateService, FormIoTagsService, FormIoUploaderComponent, FormModule, FormioBuilderComponent, FormioComponent, FormioDummyComponent, FormioOptionsImpl, FormioValueResolverSelectorComponent, InputComponent, InputLabelComponent, InputLabelModule, InputModule, IsArrayPipe, JSON_EDITOR_TEST_IDS, JsonEditorComponent, KEY_DROPDOWN_VALUE_TEST_IDS, KEY_VALUE_PATH_SELECTOR_TEST_IDS, KEY_VALUE_TEST_IDS, KeyGeneratorService, LeftSidebarComponent, LeftSidebarModule, ListColumnViewComponent, MdiIconSelectorComponent, MdiIconViewerComponent, MenuItemTextComponent, MenuItemTranslationPipe, MenuModule, MenuRoutingModule, MenuService, ModalComponent, ModalModule, ModalService, MonacoTheme, MoveRowDirection, MultiInputFormComponent, MultiInputFormModule, MultiselectDropdownComponent, MultiselectDropdownModule, MuuriDirective, MuuriDirectiveModule, MuuriItemComponent, ObserveSizeDirective, OverflowMenuComponent, OverflowMenuModule, OverflowMenuOptionComponent, OverflowMenuTriggerComponent, POPULAR_MDI_ICONS, PageHeaderComponent, PageHeaderModule, PageHeaderService, PageSubtitleService, PageTitleComponent, PageTitleModule, PageTitleService, ParagraphComponent, ParagraphModule, PendingChangesComponent, PendingChangesService, ProgressBarComponent, ProgressBarModule, PromptComponent, PromptModule, PromptService, QUICK_SEARCH_SERVICE, QuickSearchComponent, QuickSearchStateService, RIGHT_SIDEBAR_TEST_IDS, RadioComponent, RadioModule, ReadOnlyDirective, RemoveClassnamesDirective, RenderInBodyComponent, RenderInPageHeaderDirective, RenderPageHeaderDirective, RightSidebarComponent, RightSidebarModule, SINGLE_VALUE_TEST_IDS, STEPPER_FOOTER_STEP_TEST_IDS, SchemaEditorComponent, SearchFieldsComponent, SearchFieldsModule, SelectComponent, SelectModule, SelectableCarbonTheme, ShellService, SpinnerComponent, SpinnerModule, StatusSelectorComponent, StepperContainerComponent, StepperContentComponent, StepperFooterComponent, StepperFooterStepComponent, StepperHeaderComponent, StepperModule, StepperService, StepperStepComponent, TAG_ELLIPSIS_LIMIT, TableComponent, TableModule, TimelineComponent, TimelineItemImpl, TimelineModule, TooltipComponent, TooltipDirective, TooltipIconComponent, TooltipIconModule, TooltipModule, TopbarComponent, TopbarModule, UploaderComponent, UploaderDragDropDirective, UploaderModule, UserInterfaceService, VALUE_PATH_SELECTOR_DROPDOWN_VALUE_TEST_IDS, VALUE_PATH_SELECTOR_TEST_IDS, VALUE_PATH_SELECTOR_VALUE_TEST_IDS, VModalComponent, VModalModule, ValtimoCdsModalDirective, ValtimoModalService, ValuePathSelectorComponent, ValuePathSelectorInputMode, ValuePathSelectorPrefix, ValuePathSelectorService, ValuePathType, ViewContentService, ViewType, WebcamComponent, WebcamModule, WidgetComponent, WidgetModule, applyDataGridPatch, collectObjectLevels, createCustomFormioComponent, customUploaderType, enableCustomFormioComponents, menuInitializer, pendingChangesGuard, registerCustomFormioComponent, registerCustomTag, registerFormioCurrencyComponent, registerFormioCurrentUserComponent, registerFormioFileSelectorComponent, registerFormioIbanComponent, registerFormioUploadComponent, registerFormioValueResolverSelectorComponent, runAfterCarbonModalClosed, setRequiredOnSchema };
+export { ARBITRARY_AMOUNT_VALUE_TEST_IDS, AUTO_KEY_INPUT_TEST_IDS, AdminSettingsService, Alert, AlertComponent, AlertModule, AlertService, AlertType, AlertsOptionsImpl, AssignmentComponent, AutoKeyInputComponent, BOOLEAN_CONVERTER_VALUES, BpmnJsDiagramComponent, BpmnJsDiagramModule, BreadcrumbNavigationComponent, BreadcrumbNavigationModule, BreadcrumbService, CARBON_CONSTANTS, CARBON_THEME, CASES_WITHOUT_STATUS_KEY, COLOR_PICKER_TEST_IDS, CONFIRMATION_MODAL_TEST_IDS, CamundaFormComponent, CamundaFormModule, CarbonListComponent, CarbonListFilterPipe, CarbonListModule, CarbonMultiInputComponent, CarbonMultiInputModule, CarbonNoResultsComponent, CaseCountPipe, CaseTagsSelectorComponent, CdsThemeService, ChoiceFieldService, ColorPickerComponent, ComponentsPipesModule, ConfirmationModalComponent, ConfirmationModalModule, ContextMenuDirective, CtrlClickDirective, CurrentCarbonTheme, DEFAULT_LIST_TRANSLATIONS, DEFAULT_PAGINATION, DEFAULT_PAGINATOR_CONFIG, DataListComponent, DataListModule, DatePickerComponent, DatePickerModule, DateTimePickerComponent, DigitOnlyDirective, DropzoneComponent, DropzoneModule, EditorComponent, EditorModule, EllipsisPipe, ExpansionPanelComponent, ExpansionPanelModule, FieldAutoFocusDirective, FieldAutoFocusModule, FileSizeModule, FileSizePipe, FilterSidebarComponent, FilterSidebarModule, FitPageDirective, FormComponent, FormIoCurrencyComponent, FormIoCurrentUserComponent, FormIoDomService, FormIoIbanComponent, FormIoModule, FormIoStateService, FormIoTagsService, FormIoUploaderComponent, FormModule, FormioBuilderComponent, FormioComponent, FormioDummyComponent, FormioOptionsImpl, FormioValueResolverSelectorComponent, InputComponent, InputLabelComponent, InputLabelModule, InputModule, IsArrayPipe, JSON_EDITOR_TEST_IDS, JsonEditorComponent, KEY_DROPDOWN_VALUE_TEST_IDS, KEY_VALUE_PATH_SELECTOR_TEST_IDS, KEY_VALUE_TEST_IDS, KeyGeneratorService, LeftSidebarComponent, LeftSidebarModule, ListColumnViewComponent, MdiIconSelectorComponent, MdiIconViewerComponent, MenuItemTextComponent, MenuItemTranslationPipe, MenuModule, MenuRoutingModule, MenuService, ModalComponent, ModalModule, ModalService, MonacoTheme, MoveRowDirection, MultiInputFormComponent, MultiInputFormModule, MultiselectDropdownComponent, MultiselectDropdownModule, MuuriDirective, MuuriDirectiveModule, MuuriItemComponent, ObserveSizeDirective, OverflowMenuComponent, OverflowMenuModule, OverflowMenuOptionComponent, OverflowMenuTriggerComponent, POPULAR_MDI_ICONS, PageHeaderComponent, PageHeaderModule, PageHeaderService, PageSubtitleService, PageTitleComponent, PageTitleModule, PageTitleService, ParagraphComponent, ParagraphModule, PendingChangesComponent, PendingChangesService, ProgressBarComponent, ProgressBarModule, PromptComponent, PromptModule, PromptService, QUICK_SEARCH_SERVICE, QuickSearchComponent, QuickSearchStateService, RIGHT_SIDEBAR_TEST_IDS, RadioComponent, RadioModule, ReadOnlyDirective, RemoveClassnamesDirective, RenderInBodyComponent, RenderInPageHeaderDirective, RenderPageHeaderDirective, RightSidebarComponent, RightSidebarModule, SINGLE_VALUE_TEST_IDS, STEPPER_FOOTER_STEP_TEST_IDS, SchemaEditorComponent, SearchFieldsComponent, SearchFieldsModule, SelectComponent, SelectModule, SelectableCarbonTheme, ShellService, SpinnerComponent, SpinnerModule, StatusSelectorComponent, StepperContainerComponent, StepperContentComponent, StepperFooterComponent, StepperFooterStepComponent, StepperHeaderComponent, StepperModule, StepperService, StepperStepComponent, TAG_ELLIPSIS_LIMIT, TableComponent, TableModule, TimelineComponent, TimelineItemImpl, TimelineModule, TooltipComponent, TooltipDirective, TooltipIconComponent, TooltipIconModule, TooltipModule, TopbarComponent, TopbarModule, UploaderComponent, UploaderDragDropDirective, UploaderModule, UserInterfaceService, VALUE_PATH_SELECTOR_DROPDOWN_VALUE_TEST_IDS, VALUE_PATH_SELECTOR_TEST_IDS, VALUE_PATH_SELECTOR_VALUE_TEST_IDS, VModalComponent, VModalModule, ValtimoCdsModalDirective, ValtimoModalService, ValuePathSelectorComponent, ValuePathSelectorInputMode, ValuePathSelectorPrefix, ValuePathSelectorService, ValuePathType, ViewContentService, ViewType, WebcamComponent, WebcamModule, WidgetComponent, WidgetModule, applyDataGridPatch, collectObjectLevels, createCustomFormioComponent, customUploaderType, enableCustomFormioComponents, menuInitializer, pendingChangesGuard, registerCustomFormioComponent, registerCustomTag, registerFormioCurrencyComponent, registerFormioCurrentUserComponent, registerFormioFileSelectorComponent, registerFormioIbanComponent, registerFormioUploadComponent, registerFormioValueResolverSelectorComponent, runAfterCarbonModalClosed, setRequiredOnSchema };
 //# sourceMappingURL=valtimo-components.mjs.map